TypeScriptコンパイル: 不要なファイルを賢く除外！tsconfig.jsonのexcludeプロパティ徹底解説
TypeScriptにおけるtsconfig.jsonでのパターンによる除外：詳細ガイド
TypeScriptコンパイラ（tsc）は、デフォルトでプロジェクト内のすべての .ts ファイルをコンパイルします。しかし、テストファイル、ライブラリファイル、生成されたコードなど、コンパイルする必要のないファイルも存在します。このようなファイルをコンパイル対象から除外するために、tsconfig.json ファイルの exclude プロパティが役立ちます。
本ガイドでは、tsconfig.json におけるパターンによるファイル除外について、詳細な解説と実践的な例を交えて説明します。
exclude プロパティは、tsconfig.json ファイル内に記述される配列であり、コンパイル対象から除外するファイルやディレクトリのパスをパターンで指定します。パターンは、単純なワイルドカードから、より高度な glob パターンまで様々な形式を使用できます。
パターン形式
exclude プロパティで使用できるパターン形式は次のとおりです。
単純なワイルドカード:
*: 任意の数の文字列に一致?: 1文字に一致[...]:指定された文字のいずれかに一致
glob パターン:
**: ディレクトリツリー全体に一致{pattern1,pattern2}: 複数のパターンを論理 OR で結合!(pattern): パターンを除外
除外パターンの適用順序
exclude プロパティで指定されたパターンは、上から下に処理されます。つまり、上位のパターンが下位のパターンよりも優先されます。この特性を利用して、より複雑な除外ルールを定義できます。
実践的な例
以下に、exclude プロパティを使用した除外パターンの具体的な例を示します。
例 1：テストファイルを除外する
{
"exclude": [
"test/**/*.ts"
]
}
この例では、test ディレクトリツリー内のすべての .ts ファイルがコンパイル対象から除外されます。
例 2：ライブラリファイルを除外する
{
"exclude": [
"node_modules/**/*.ts",
"bower_components/**/*.ts"
]
}
この例では、node_modules と bower_components ディレクトリツリー内のすべての .ts ファイルがコンパイル対象から除外されます。
例 3：生成されたコードを除外する
{
"exclude": [
"dist/**/*.ts"
]
}
この例では、dist ディレクトリツリー内のすべての .ts ファイルがコンパイル対象から除外されます。これは、通常、ビルドプロセスによって生成されるコードを格納するディレクトリです。
include プロパティとの併用
exclude プロパティは、include プロパティと併用して使用できます。include プロパティは、コンパイル対象とするファイルやディレクトリのパスをパターンで指定します。
例 4：特定のディレクトリのみをコンパイルする
{
"include": [
"src/**/*.ts"
],
"exclude": [
"test/**/*.ts",
"node_modules/**/*.ts"
]
}
この例では、src ディレクトリツリー内のすべての .ts ファイルのみがコンパイル対象となり、test と node_modules ディレクトリ内のファイルは除外されます。
注意点
excludeプロパティで指定するパターンは、tsconfig.jsonファイルが存在するディレクトリを基準とした相対パスです。- ワイルドカードと glob パターンを混在させることはできません。
- 除外するファイルが他のファイルによって参照されている場合、コンパイルエラーが発生する可能性があります。
この例では、以下のディレクトリ構造を持つプロジェクトを想定します。
project
├── src
│ ├── app
│ │ ├── app.component.ts
│ │ ├── app.module.ts
│ │ └── app.routing.module.ts
│ ├── index.ts
│ └── test
│ └── test.spec.ts
├── node_modules
│ └── @types
├── package.json
└── tsconfig.json
tsconfig.json
以下の tsconfig.json ファイルを作成します。この設定では、test ディレクトリと node_modules ディレクトリツリー内のすべてのファイルをコンパイル対象から除外します。
{
"compilerOptions": {
"target": "es6",
"module": "commonjs",
"outDir": "dist"
},
"include": [
"src/**/*.ts"
],
"exclude": [
"test/**/*.ts",
"node_modules/**/*.ts"
]
}
実行
以下のコマンドを実行して、TypeScriptファイルをコンパイルします。
tsc
コンパイルが成功すると、dist ディレクトリにコンパイルされたJavaScriptファイルが生成されます。このディレクトリには、test ディレクトリと node_modules ディレクトリ内のファイルは含まれません。
- 特定の拡張子を持つファイルをすべて除外する：
"exclude": [
"*.spec.ts",
"*.d.ts"
]
- 特定のファイルのみを除外する：
"exclude": [
"src/app/app.component.css"
]
注意事項
includeプロパティと併用する場合は、includeで指定したファイルがexcludeで除外されないように注意する必要があります。
TypeScriptにおけるtsconfig.json以外でのファイル除外方法
グロブパターンを使用したCLIオプション
tsc コマンドラインツールには、--exclude オプションと --excludeDir オプションが用意されています。これらのオプションを使用して、コンパイル対象から除外するファイルやディレクトリを直接指定できます。
tsc --exclude "test/**/*.ts" --excludeDir "node_modules" src/**/*.ts
このコマンドは、tsconfig.json ファイルを使用せずに、上記例のプロジェクトと同じファイルをコンパイルします。
ロールアップなどのバンドルツール
Rollupなどのバンドルツールを使用している場合は、そのツール自身がファイルの除外機能を提供している場合があります。これらの機能を使用して、tsconfig.json ファイルとは別にファイルを除外することができます。
カスタムビルドスクリプト
npm や yarn などのタスクランナーを使用して、カスタムビルドスクリプトを作成することもできます。このスクリプトを使用して、コンパイル対象から除外するファイルを独自に処理することができます。
上記の方法を使用する場合は、以下の点に注意する必要があります。
- 使用するツールやスクリプトによって、ファイル除外の構文やオプションが異なる場合があります。
tsconfig.jsonファイルを使用する場合と比べて、設定の一貫性やメンテナンス性が損なわれる可能性があります。
tsconfig.json ファイルは、TypeScriptプロジェクトからファイルをコンパイル対象から除外する最も一般的で推奨される方法です。しかし、上記で紹介した代替手段も、状況によっては有用な場合があります。
typescript tsconfig
