Node.jsがES6モジュールを処理する方法の詳細な説明

1. 2つのモジュールの違い

ES6 モジュールと CommonJS モジュールには大きな違いがあります。

構文的には、CommonJS モジュールは require() を使用してロードされ、module.exports を使用してエクスポートされますが、ES6 モジュールは import と export を使用します。

使用法としては、require() は同期ロードであり、後続のコードはこのコマンドが実行されるまで待機してから実行する必要があります。 import コマンドは非同期ロードです。より正確には、ES6 モジュールには独立した静的解析フェーズがあり、その段階で依存関係の解析が完了し、最下位レベルのモジュールが最初に実行されます。

2. Node.jsとの違い

Node.js では、ES6 モジュールで .mjs サフィックス ファイル名を使用する必要があります。つまり、スクリプト ファイルでインポート コマンドまたはエクスポート コマンドが使用される限り、.mjs サフィックスを使用する必要があります。 Node.js は .mjs ファイルを検出すると、それを ES6 モジュールと見なし、デフォルトで厳密モードを有効にします。各モジュール ファイルの先頭で "use strict" を指定する必要はありません。

サフィックスを .mjs に変更したくない場合は、プロジェクトの package.json ファイルで type フィールドを module として指定できます。

{
   「タイプ」：「モジュール」
}

設定すると、このディレクトリ内の JS スクリプトは ES6 モジュールとして解釈されます。

# ES6モジュールとして解釈する

$ ノード my-app.js

現時点でも CommonJS モジュールを使用したい場合は、CommonJS スクリプトのサフィックスを .cjs に変更する必要があります。 type フィールドがない場合、または type フィールドが commonjs の場合、.js スクリプトは CommonJS モジュールとして解釈されます。

一言でまとめると、.mjs ファイルは常に ES6 モジュールとして読み込まれ、.cjs ファイルは常に CommonJS モジュールとして読み込まれ、.js ファイルの読み込みは package.json の type フィールドの設定によって決まります。

ES6 モジュールと CommonJS モジュールを混在させないでください。 require コマンドは .mjs ファイルを読み込むことができないため、エラーが報告されます。import コマンドのみが .mjs ファイルを読み込むことができます。逆に、.mjs ファイルでは require コマンドは使用できず、import を使用する必要があります。

3. CommonJSモジュールの読み込みES6モジュール

CommonJS の require() コマンドは ES6 モジュールをロードできず、エラーを報告します。ロードするには import() メソッドのみを使用できます。

(非同期() => {
  './my-app.mjs' をインポートするのを待ちます。
})();

上記のコードは CommonJS モジュールで実行できます。

require() が ES6 モジュールをサポートしない理由の 1 つは、同期的にロードされ、最上位レベルの await コマンドが ES6 モジュール内で使用できるため、同期的にロードできないことです。

4. ES6モジュールはCommonJSモジュールをロードする

ES6 モジュールの import コマンドは CommonJS モジュールを読み込むことができますが、単一の出力項目ではなく、モジュール全体を読み込むことができます。

// 正しい import packageMain from 'commonjs-package';

// エラー import { method } from 'commonjs-package';

これは、ES6 モジュールは静的コード解析をサポートする必要があり、CommonJS モジュールの出力インターフェースは module.exports であり、これはオブジェクトであり静的に解析できないため、全体としてしかロードできないためです。

単一の出力項目をロードする場合は、次のように記述できます。

'commonjs-package' から packageMain をインポートします。
const { メソッド } = packageMain;

5. 両方の形式をサポートするモジュール

モジュールに対して CommonJS と ES6 の両方の形式をサポートすることも簡単です。

元のモジュールが ES6 形式の場合、CommonJS が import() を使用してロードできるように、export default obj などの全体的な出力インターフェースを指定する必要があります。

元のモジュールが CommonJS 形式の場合は、ラッパー レイヤーを追加できます。

'../index.js' から cjsModule をインポートします。
エクスポート const foo = cjsModule.foo;

上記のコードは、まず CommonJS モジュール全体をインポートし、次に必要に応じて名前付きインターフェースを出力します。

ファイル拡張子を .mjs に変更するか、サブディレクトリに配置して、そのサブディレクトリに { type: "module" } を指定して別の package.json ファイルを配置することができます。

もう 1 つの方法は、package.json ファイルの exports フィールドに 2 つの形式のモジュールの読み込みエントリ ポイントを指定することです。

「エクスポート」: { 
    "require": "./index.js",
    「インポート」: 「./esm/wrapper.js」 
}

上記のコードでは require() と import を指定しており、モジュールをロードすると自動的に別のエントリ ファイルに切り替わります。

上記は、Node.js が ES6 モジュールを処理する方法についての詳細な説明です。Node.js が ES6 モジュールを処理する方法の詳細については、123WORDPRESS.COM の他の関連記事に注目してください。