基礎知識

CommonJSとES Moduleの違い

 

CommonJSとは？

CommonJS（CJS）はJavaScriptのモジュールシステムの一つで、主にNode.js で使われています。

もともとはブラウザ外（サーバーサイド）で JavaScript を動作させるために設計されました。

  1. require() を使ってモジュールを読み込む
  2. module.exportsでモジュールをエクスポート
  3. 同期的に読み込む
  4. Node.js でデフォルトで使用されている
  5. ブラウザではそのまま使えない（Webpack や Browserify などのツールが必要）

ES Module (ESM)とは？

ES Module（ESM）はECMAScript 2015（ES6）で導入された標準のモジュールシステムです。

CommonJS（CJS）の require()/module.exportsに代わり、ESMではimport/exportを使用します。

  1. import / export を使用
  2. 非同期的（async）にモジュールを読み込む
  3. ブラウザと Node.js の両方で利用可能
  4. Node.jsで使う場合には.mjs拡張子が必要、またはpackage.jsonに"type": "module"を設定必要

使い分け方

新しいプロジェクトではES Moduleを利用すると良いでしょう。

ただしNode.jsが使われている既存プロジェクトではCommonJSの方が一般的です。