Kuo skiriasi ES moduliai nuo CommonJS?

Question

Accepted Answer

Tai yra du JavaScript modulio sistemos variantai, skirti kodui suskaidyti per failus.

## ES moduliai (ESM) — šiuolaikinis standartas

```js
// import / export, used in browsers and modern Node
import { sum } from "./math.js";
import defaultThing from "./thing.js";
export const x = 1;
export default function () {};
```

## CommonJS (CJS) — Node pasenusio tipo sistema

```js
const { sum } = require("./math");
module.exports = { x: 1 };
```

## Pagrindiniai skirtumai

| | ES moduliai | CommonJS |
|---|---|---|
| Sintaksė | `import`/`export` | `require`/`module.exports` |
| Įkėlimas | static, async | dinaminis, sinchroninis |
| Analizuojamas | ✅ → tree-shaking | ❌ sunkiau |
| Ryšiai | live (tik skaityti) | nukopijuota reikšmė |
| `this` viršuje | `undefined` | `module.exports` |

**Static** reiškia, kad ESM importai žinomi analizės metu, o tai leidžia bundle'riams atlikti **tree-shaking** (pašalinti nenaudojamus eksportus). CommonJS `require` yra dinaminis (galite `require` sąlyginai), todėl jį sunkiau analizuoti.

## ESM įjungimas Node

```json
{ "type": "module" } // in package.json, or use the .mjs extension
```

## Interop grėsmė

Negalite naudoti `require()` ESM-tik paketui iš CommonJS; abiejų mišinimas turi šiurkščių kraštų. ESM importai taip pat yra **live ryšiai** — jei eksportuotojas pakeičia reikšmę, importuotojai mato naują reikšmę (CJS suteikia jums snapshot kopijos).

## Dėl ko tai svarbu

ESM yra ateitis (native naršyklei, tree-shakeable, top-level `await`).

Teikite pirmenybę naujam kodui; supraskite CJS, nes didelė Node ekosistemos dalis ją vis dar naudoja.

	ES moduliai	CommonJS
Sintaksė	`import`/`export`	`require`/`module.exports`
Įkėlimas	static, async	dinaminis, sinchroninis
Analizuojamas	✅ → tree-shaking	❌ sunkiau
Ryšiai	live (tik skaityti)	nukopijuota reikšmė
`this` viršuje	`undefined`	`module.exports`