Dies sind JavaScripts zwei Modulsysteme zum Aufteilen von Code auf mehrere Dateien.
ES Modules (ESM) — der moderne Standard
js
// import / export, used in browsers and modern Node
import { sum } from "./math.js";
defaultThing ;
x = ;
() {};
Dies sind JavaScripts zwei Modulsysteme zum Aufteilen von Code auf mehrere Dateien.
// import / export, used in browsers and modern Node
import { sum } from "./math.js";
defaultThing ;
x = ;
() {};
const { sum } = require("./math");
module.exports = { x: 1 };
| ES Modules | CommonJS | |
|---|---|---|
| Syntax | import/export | require/module.exports |
| Laden | statisch, asynchron | dynamisch, synchron |
| Analysierbar | ✅ → tree-shaking | ❌ schwieriger |
| Bindungen | live (schreibgeschützt) | kopierter Wert |
this oben | undefined | module.exports |
Statisch bedeutet, dass ESM-Importe zur Parse-Zeit bekannt sind, was Bundlern tree-shaking (ungenutzte Exports entfernen) ermöglicht. CommonJS require ist dynamisch (du kannst bedingt require), daher kann es nicht so leicht analysiert werden.
{ "type": "module" } // in package.json, or use the .mjs extension
Du kannst ein ESM-only-Paket aus CommonJS nicht require(); das Mischen beider hat raue Kanten. ESM-Importe sind auch live bindings — wenn der Exporteur den Wert ändert, sehen Importeure den neuen Wert (CJS gibt dir eine Snapshot-Kopie).
ESM ist die Zukunft (browsernativ, tree-shakeable, Top-Level await).
Bevorzuge es für neuen Code; verstehe CJS, weil viel des Node-Ökosystems es noch verwendet.