ES Modules (import/export)

1// ES Modules — Complete Guide
2
3// === math.mjs (or .js with "type": "module" in package.json) ===
4
5// Named exports
6export const PI = 3.14159;
7export const E = 2.71828;
8
9export function add(a, b) {
10  return a + b;
11}
12
13export function subtract(a, b) {
14  return a - b;
15}
16
17// Default export (one per module)
18export default class Calculator {
19  constructor() {
20    this.history = [];
21  }
22
23  calculate(op, a, b) {
24    let result;
25    switch (op) {
26      case "+": result = a + b; break;
27      case "-": result = a - b; break;
28      case "*": result = a * b; break;
29      case "/": result = b !== 0 ? a / b : NaN; break;
30      default: throw new Error(`Unknown operator: ${op}`);
31    }
32    this.history.push({ op, a, b, result });
33    return result;
34  }
35
36  getHistory() {
37    return [...this.history];
38  }
39}
40
41// === app.mjs — Importing ===
42
43// 1. Import named exports
44import { add, subtract, PI } from "./math.mjs";
45console.log(add(2, 3));  // 5
46console.log(PI);          // 3.14159
47
48// 2. Import default export
49import Calculator from "./math.mjs";
50const calc = new Calculator();
51console.log(calc.calculate("+", 10, 5)); // 15
52
53// 3. Import everything as a namespace
54import * as MathUtils from "./math.mjs";
55console.log(MathUtils.add(1, 2)); // 3
56console.log(MathUtils.PI);        // 3.14159
57
58// 4. Rename imports (aliasing)
59import { add as sum, subtract as diff } from "./math.mjs";
60console.log(sum(1, 2));  // 3
61console.log(diff(5, 3)); // 2
62
63// 5. Re-exporting (barrel exports)
64// === index.mjs ===
65// export { add, subtract } from "./math.mjs";
66// export { default as Calculator } from "./math.mjs";
67// export * from "./utils.mjs";
68
69// 6. Dynamic imports (async, works anywhere)
70async function loadModule(moduleName) {
71  try {
72    const module = await import(`./modules/${moduleName}.mjs`);
73    return module.default || module;
74  } catch (err) {
75    console.error(`Failed to load module: ${moduleName}`);
76    return null;
77  }
78}
79
80// 7. Top-level await (ESM only!)
81// const data = await fs.promises.readFile("config.json", "utf-8");
82// const config = JSON.parse(data);
83// This blocks the module from finishing loading until the await resolves
84
85// 8. import.meta — Module metadata
86console.log("Module URL:", import.meta.url);
87// file:///Users/you/project/app.mjs
88
89// Get __dirname equivalent in ESM
90import { fileURLToPath } from "url";
91import { dirname } from "path";
92const __filename = fileURLToPath(import.meta.url);
93const __dirname = dirname(__filename);
94console.log("Directory:", __dirname);
95
96// 9. Importing CommonJS from ESM
97// ✅ This works — CJS default export becomes the ESM default
98// import express from "express";  // express is CJS
99
100// ❌ Named imports from CJS may not work
101// import { Router } from "express";  // May fail!
102// Instead:
103// import express from "express";
104// const { Router } = express;
105
106// 10. Conditional exports in package.json
107// {
108//   "exports": {
109//     ".": {
110//       "import": "./dist/index.mjs",   // ESM entry
111//       "require": "./dist/index.cjs"   // CJS entry
112//     }
113//   }
114// }