ECMAScript Modules (ESM)#

• JavaScriptの標準規格で定義されたモジュールシステム
• ブラウザとNode.jsで動作
• 静的にモジュールを解析し、依存関係を解決
• 型情報を含む
• デフォルトエクスポートのみ許可
• 相対パスと絶対パスの両方をサポート
• 簡潔な構文
• 動的importや名前空間など、新しい機能をサポート

CommonJS#

• Node.jsコミュニティで開発されたモジュールシステム
• Node.jsでのみ動作
• 実行時にモジュールをロードし、依存関係を解決
• 型情報は含まない
• すべてのエクスポートを許可
• 相対パスのみサポート
• 複雑な構文
• CommonJSモジュールのエコシステムとの互換性

その他の違い#

動的import

1
// モジュールA.js
2
const B = require("./B");
3

4
// モジュールB.js
5
const A = require("./A");
6

7
// エラー: サイクル依存が発生

どちらを使用するべきか#

• ブラウザで動作するコード: importを使用
• Node.jsで動作するコード: requireを使用
• 新しい機能を使用したい場合: importを使用
• 既存のCommonJSモジュールと互換性を保ちたい場合: requireを使用

関連記事#

import と require の違い