演習 - モジュールをコンパイルする

  • 5 分

モジュールはモジュール ローダーを使用して相互にインポートされます。 実行時に、モジュール ローダーによって、モジュールの実行前にそのすべての依存関係が検索され、実行されます。 コンパイル時に指定したモジュール ターゲットに応じて、Node.js (CommonJS)、require.js (AMD)、UMD、SystemJS、または ECMAScript 2015 ネイティブ モジュール (ES6) モジュール読み込みシステムに適したコードがコンパイラによって生成されます。 

モジュールをコンパイルするには、コマンド ラインまたはプロジェクトの tsconfig.json ファイルで --module ターゲットを指定します。

前の演習からのプロジェクトを続行します。

  1. ターミナルを開き、次のコマンドを入力して Node.js 用の main.ts モジュールをコンパイルします。

    tsc --module commonjs main.ts

  2. コンパイラでは import ステートメントに従って、すべての依存ファイルをコンパイルします。 main.ts がコンパイルされると、各モジュールが個別の .js ファイルになることに注目してください。

  3. 「node main」と入力して、ファイルをテストします。

Web ページからのモジュールの実行

代わりに、Web ブラウザーで使用するために ES6 用の TypeScript ファイルをコンパイルする場合は、次のコマンドを入力します。

tsc --module es6 main.ts

Web ページからモジュールを実行する場合は、必ず type オプションを "module" に設定してください。

<script type="module" src=".\main.js"></script>

演習のソリューション

この演習のソリューションを確認するには、コマンド プロンプトで次のように入力してリポジトリをクローンします。

git clone https://github.com/MicrosoftDocs/mslearn-typescript
cd mslearn-typescript/code/module-07/module07-exercise-01-end
code .