ES vs CommonJS

JS ⟩ module ⟩ ES vs CommonJS

(Node.js)

ES modules can import ES or CommonJS module exports.
CommonJS modules can only require CommonJS module exports.

// (package.json in Node.js) 
"type": "module"      // ES module
"type": "commonjs"    // CommonJS module (⭐️ default)

                    ES export    CommonJS export
-------------------------------------------------
ES import           ✅           ✅
CommonJS require    ❌           ✅ 
-------------------------------------------------
⭐️ looks like CommonJS "module.exports" is a better choice❓

module path name

const obj = require(`./${name}`);    // require: can be dynamic
import {obj} from './module.js';     // import: must be string literal

file name extension

// require: can leave out .js when importing a local module.
require("./module")                 // ✅ works

// import: won't work without .js
import module from "./module"       // ❌ won't work
import module from "./module.js"    // ✅ works

execution order

require (expression) - runs inline, after the code above it.
import (statement) - runs before the rest of the script. (note: import expressions can be dynamic.)

(Node.js) in an ES module (.mjs / .js of "type":"module")：

can only use import / export .
can import CommonJS exports.
cannot use require.

// (in Node.js) "type": "module"
import {str} from './es.mjs';          // .mjs - es module
import {obj} from './commonjs.cjs';    // .cjs - commonjs module

(Node.js) in an CommonJS module (.cjs / .js of "type":"commonjs")：

cannot use require to load an ES module.

(Node.js)

.cjs -> CommonJS module.
.mjs -> ES module.
.js
- "type":"module" -> ES module.
- "type":"commonjs" -> CommonJS module.

(in browser)

cannot use require.
cannot import CommonJS exports.
can only use ES import / export .

Previouspackage.json Nextimport.meta

Last updated 2 years ago

Was this helpful?

// (package.json in Node.js) "type": "module" // ES module "type": "commonjs" // CommonJS module (⭐️ default) ES export CommonJS export ------------------------------------------------- ES import ✅ ✅ CommonJS require ❌ ✅ ------------------------------------------------- ⭐️ looks like CommonJS "module.exports" is a better choice❓

// require: can leave out .js when importing a local module. require("./module") // ✅ works // import: won't work without .js import module from "./module" // ❌ won't work import module from "./module.js" // ✅ works