【早見表】tsconfig.jsonのオプションのまとめ

TypeScriptの構成ファイル tsconfig.json
は、プロジェクトのビルドや型チェックを細かく制御する重要な役割を果たします。
設定可能なオプションは多岐にわたり、最適に使いこなすことで開発効率や安全性を大きく向上させることができます。
プロジェクト設定の中核を担うtsconfig.json
TypeScriptでは tsconfig.json
によって、トランスパイル対象の範囲、JavaScriptへの出力形式、型の解釈方法などを柔軟に調整できます。
しかしその分、オプションが非常に多く「最低限どれを設定すればよいか」「使い分けはどうするか」と悩む場面も多くあります。
本記事では、TypeScript公式仕様をもとに、使用頻度が高いオプションを中心に網羅的な「早見表」として整理しています。
初学者から中〜上級者までが参照できるようカテゴリごとにまとめました。
よく使うtsconfigオプション早見表(分類別)
コンパイル出力と構文設定
オプション | 説明と用途 | よく使う値例 |
---|---|---|
target | 出力されるJavaScriptのバージョン。 | es5 , es2015 , es2020 , esnext |
module | モジュールシステムの形式を指定。 | commonjs , esnext , nodenext |
lib | 利用可能な型定義ライブラリのセット。 | ["dom", "esnext"] |
jsx | JSXの変換方式。Reactを使う際は必須。 | react-jsx , react , preserve |
outDir | コンパイル後の出力先ディレクトリ。 | ./dist , ./build |
rootDir | コンパイル対象のルートディレクトリ。 | ./src |
removeComments | コメントを出力JSから削除。 | true |
sourceMap | ソースマップを生成(デバッグ用途)。 | true |
declaration | .d.ts 型定義ファイルを出力。 | true |
declarationMap | .d.ts に対するソースマップも出力。 | true |
型チェック・安全性強化
オプション | 説明と用途 | よく使う値 |
---|---|---|
strict | 以下のすべてのチェックを有効化する総合スイッチ。 | true |
noImplicitAny | 型注釈なしでanyになる変数を禁止。 | true |
strictNullChecks | null や undefined を厳密に扱う。 | true |
strictFunctionTypes | 関数型の互換性チェックを厳密に。 | true |
strictBindCallApply | bind/call/apply メソッドの型チェックを強化。 | true |
alwaysStrict | 全ファイルに 'use strict' を追加し、厳格モードで実行。 | true |
noImplicitReturns | 関数内で戻り値がないパスが存在することを警告。 | true |
noFallthroughCasesInSwitch | switch文でのfallthrough(break漏れ)を禁止。 | true |
useUnknownInCatchVariables | catch節の変数を any ではなく unknown 扱いにする。 | true |
モジュール解決と構成制御
オプション | 説明と用途 | よく使う値例 |
---|---|---|
moduleResolution | モジュールの解決アルゴリズム。 | node , bundler , nodenext |
baseUrl | モジュール解決の基準パス。 | ./src |
paths | モジュールエイリアスを設定。 | { "@utils/*": ["utils/*"] } |
rootDirs | 複数のルートディレクトリを1つの仮想ディレクトリとして扱う。 | ["src", "generated"] |
typeRoots | 型定義ファイルの検索ディレクトリを指定。 | ["./node_modules/@types"] |
types | 明示的に使いたい型定義パッケージを指定。 | ["node", "jest"] |
resolveJsonModule | .json ファイルのimportを可能にする。 | true |
esModuleInterop | ESModulesとCommonJSのinteropを有効に。 | true |
allowSyntheticDefaultImports | default importを許容(interopの補助)。 | true |
preserveSymlinks | シンボリックリンクの解決を行わずに維持。 | false |
コンパイル挙動制御とビルド最適化
オプション | 説明と用途 | よく使う値 |
---|---|---|
incremental | 増分ビルドを有効化し、高速化。 | true |
tsBuildInfoFile | 増分ビルド用のキャッシュファイルパス。 | ./.tsbuildinfo |
composite | プロジェクト参照(Project References)向けの設定。 | true |
isolatedModules | 各ファイルを独立したモジュールとしてトランスパイル可能に。 | true |
noEmit | 出力ファイルを生成しない(型チェックのみ)。 | true |
emitDeclarationOnly | .d.ts のみ出力し、JSは生成しない。 | true |
その他・ユーティリティ的な設定
オプション | 説明と用途 | よく使う値 |
---|---|---|
watch | ファイル変更を監視して自動再コンパイル(tsc CLI用)。 | true |
pretty | コンパイル時のログ出力を見やすく整形。 | true |
skipLibCheck | 外部ライブラリの型チェックを省略してビルドを高速化。 | true |
forceConsistentCasingInFileNames | ファイル名の大文字小文字の一貫性を強制。 | true |
公式リファレンスと便利リンク集
以下の公式リソースを使えば、各オプションの最新仕様や適用方法を確認できます。
また、IDE(VSCodeなど)では tsconfig.json
を編集中に自動補完が効くため、公式型定義の辞書としても活用できます。
自分のプロジェクトに最適な構成を選ぼう
tsconfig.json
の設定は「正解が一つ」というものではなく、プロジェクトの性質、目的、規模、使用するフレームワークなどにより最適な構成が変わります。
本記事の早見表は、以下のようなシーンで活用いただけます:
- 新規プロジェクトのtsconfig設計時
- 既存プロジェクトの型精度やビルド速度の改善時
- 他人のtsconfigを読むときのリファレンス
設定を理解し試行錯誤する中で、TypeScriptの力を最大限に引き出せるようになります。
ぜひ今後の開発でも、本記事をリファレンスとしてお役立てください。
TypeScriptの記事Typescript
- article
VSCodeで開発時のインポート補完(TypeScript)を相対パスからエイリアスにする設定
- article
【解決策】TypeScriptで発生するTS2564エラーの対応
- article
Next.js のTypeScriptプロジェクトへeslint、stylelint、prittierを導入してVSCodeで自動フォーマットするまでの手順
- article
Next.jsをパッケージからインストールしNext.jsプロジェクトへTypescript環境を構築して動かすまでの手順
- article
【マイグレーション】TypeScriptを使用したNext.js 6からNext.js 7へ移行した時行った対応について
- article
TypeScriptを使用したNext.js 5からNext.js 6へ移行した時行った対応について
- article
【対処法】Cursorで発生する「Connection failed. If the problem persists ...」エラーの原因と対応
- article
Next.jsとEdge Runtimeを組み合わせて超低遅延サーバーレス表示を実現する方法
- article
Next.jsでSEO対策を強化するための5つのポイント + アンチパターンの回避策
- article
Dockerのよくあるアンチパターン10選+実践的な回避策
- article
社内開発でDockerを導入する際に考えるべき運用ポイント
- article
Kubernetes vs Docker Compose 違いと使い分け、選び方のポイント