0Pricing
TypeScript Academy · レッスン

ModuleとTargetの設定

適切なmodule、target、libの設定を選びます。

「ModuleとTargetの設定」はCoddyKit上の無料TypeScript Academyレッスンです。 これはレッスン2/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全4レッスンが含まれています。

ようこそ

tsconfigのmoduleとtargetの設定は、TypeScriptがコンパイルするJavaScript構文を制御します。

target設定

targetは、出力するJavaScriptの構文機能を制御します。ES2020は安全で現代的なデフォルト設定です。
{ "compilerOptions": { "target": "ES2020" } }

一般的なターゲット

レガシーブラウザーにはES5、最新の環境にはES2020以降、最先端の機能にはESNextを使用します。

module設定

moduleは、出力されるJSで使用するモジュールシステム(commonjs、ES2020、NodeNext、bundler)を制御します。
{ "compilerOptions": { "module": "commonjs" } }
// For ESM: "module": "ES2020" or "NodeNext"

moduleResolution

TypeScriptがモジュールを見つける方法を指定します。最新のプロジェクトにはnode16またはbundlerを使用します。
{ "compilerOptions": { "moduleResolution": "bundler" } }

esModuleInterop

* as構文を使わずに、CommonJSモジュールからデフォルトインポートできるようにします。
{ "compilerOptions": { "esModuleInterop": true } }
import express from 'express'; // instead of * as express

lib設定

libは、利用可能な組み込みAPI(DOM、ES2020など)を指定します。
{ "compilerOptions": { "lib": ["ES2020", "DOM"] } }

isolatedModules

各ファイルを独立してトランスパイルできるようにします。esbuildやBabelでは必須です。
{ "compilerOptions": { "isolatedModules": true } }

verbatimModuleSyntax

型だけをインポートする場合に、import typeの使用を強制します。以前のimportsNotUsedAsValuesに代わる設定です。
{ "compilerOptions": { "verbatimModuleSyntax": true } }

jsx設定

Reactプロジェクトでは、jsxにreact-jsxまたはreactを設定します。
{ "compilerOptions": { "jsx": "react-jsx" } }

resolveJsonModule

型推論を利用してJSONファイルをインポートできるようにします。
{ "compilerOptions": { "resolveJsonModule": true } }

確認問題

tsconfigの`target`オプションは何を制御しますか?

まとめ

モジュールとターゲットの設定:重要な概念とパターンを身につけました。

よくある質問

「ModuleとTargetの設定」レッスンは無料ですか?

はい。「ModuleとTargetの設定」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全4レッスンが含まれています。

「ModuleとTargetの設定」で何を学びますか?

適切なmodule、target、libの設定を選びます。 ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

TypeScript Academyを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/4です。

「ModuleとTargetの設定」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このTypeScript Academyレッスンでコードを書いて実行できますか?

はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. strictフラグと有効になる機能
  2. ModuleとTargetの設定
  3. Path AliasとbaseUrl
  4. Incremental BuildとDeclaration File
← TypeScript Academyに戻る