メインコンテンツへスキップ

トラブルシューティングハンドブック: tsconfig.json

すべての コンパイラオプションについては、TypeScript のドキュメントを参照 してください。 新しい TS ドキュメントには、各オプションの説明も記載されています。これがアプリ用の設定です(ライブラリ用ではありません。ライブラリのについては tsdx で使用する設定を参照してください)。

{
"compilerOptions": {
"incremental": true,
"outDir": "build/lib",
"target": "es5",
"module": "esnext",
"lib": ["DOM", "ESNext"],
"sourceMap": true,
"importHelpers": true,
"declaration": true,
"rootDir": "src",
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"allowJs": false,
"jsx": "react",
"moduleResolution": "node",
"baseUrl": "src",
"forceConsistentCasingInFileNames": true,
"esModuleInterop": true,
"suppressImplicitAnyIndexErrors": true,
"allowSyntheticDefaultImports": true,
"experimentalDecorators": true
},
"include": ["src/**/*"],
"exclude": ["node_modules", "build", "scripts"]
}

推奨される TS 設定をさらに見つけることができます

React により適した推奨オプションがある場合は、問題を開いて議論してください。

選択したフラグとその理由

  • esModuleInterop: 名前空間のインポート(import * as foo from "foo")を無効にして、CJS/AMD/UMD スタイルのインポート(import fs from "fs")を有効にします。
  • strict: strictPropertyInitialization を使用すると、クラスのプロパティを初期化する必要が生じたり、未定義にすることができることを明示的に宣言する必要が生じます。確定割り当てアサーションを使用してこれをオプトアウトすることができます。
  • "typeRoots": ["./typings", "./node_modules/@types"]: デフォルトでは、TypeScript は node_modules/@types と親フォルダーでサードパーティ製の型宣言を探します。すべてのグローバル型宣言を特別な typings フォルダーに入れることができるように、このデフォルトの解決をオーバーライドすることをお勧めします。

コンパイル時間はコードベースのサイズに伴って直線的に増加します。大規模プロジェクトの場合は、プロジェクト レファレンスの使用をお勧めします。詳細については、上級者向けチートシートをご覧ください。