🐥

typescriptのビルド周りのお勉強

に公開
TypeScript
tech

モチベーション

なんとなくtypescript(backend)周りを触っているけどビルド周りをちゃんと勉強したことがないので。

TypeScriptにおけるビルド

chatgpt回答

まずは「なぜビルドが必要か」を押さえると全体像がつかみやすいです。

  • TypeScript → JavaScript に変換（tsc）
  • モジュール解決（ESM / CommonJS の違い）
  • 型チェックと実行ファイル生成の分離（型だけチェックして JS は触らないオプションもある）

tsconfig.json

TypeScriptのコンパイルオプションを設定するファイル。
主要なオプションをいくつか見ていく。

target

どのバージョンのJavaScriptに変換するかを指定する。
ES2024やESNextとかそういうの。
backend利用であればruntimeに合わせて適切なバージョンををしていすれば良さそうと理解した。

module

どのモジュールシステムを利用するかを指定する。
ESModules, CommonJS, NodeNextあたりを指定できる。

そもそもここでいうモジュールって？

生成する JS のモジュール形式のこと。

  • CommonJS (CJS)
    • Node.js 初期から使われてきた方式
    • 同期的な require を使う
    • .js ファイルはデフォルトで CJS として解釈される（Node.js の古い仕様）
    • 古いエコシステムで広く使われている
    • ブラウザ標準では使えない（Node.js 独自仕様）
  • ESModule (ESM)
    • JavaScript の正式な標準モジュールシステム（ES2015 で導入）
    • 静的な import/export を使う
    • ブラウザでもそのまま使える
    • 今後の標準は ESM らしい
    • Node.js 側で歴史的にサポートが後付け → 互換性がまだ面倒
      • package.json に "type": "module" を書く必要あり

exclude

コンパイルに含めたくないファイルを指定する。

"exclude": ["foo.ts"]

strict

以下のオプションが有効になり、厳密な型チェックがされる。

  • noImplicitAny
  • strictNullChecks
  • strictFunctionTypes
  • strictBindCallApply
  • strictPropertyInitialization
  • noImplicitThis
  • useUnknownInCatchVariables
  • alwaysStrict

参考

いくつか見る。

noImplicitAny

暗黙的な any 型が許可されなくなる。

strictNullChecks

true の場合は null や undefined をコンパイル時にチェックできる。

strictFunctionTypes

引数の共変性を許容しない。
共変性については自分もわかっていなかったので以下で調べた。
strictFunctionTypes

outDir

コンパイルされて生成された js ファイルの出力先ディレクトリを指定。
未指定の場合は対象のtsファイルと同じディレクトリに出力される。

incremental

以前コンパイルした結果との差分のみををけんしゅつして　コンパイルするようにする設定。
.tsbuildinfo ファイルに差分情報を保持する。
tsconfig変更時は .tsbuildinfo を削除しないと適切にビルドできないことがある。

removeComments

コンパイルの出力結果のファイルからコメントを削除する。

noUnusedLocals

宣言されているだけで未使用の変数があるとコンパイルエラーにする。

noUnusedParameters

未使用のパラメータがある場合にコンパイルエラーにする。

noImplicitReturns

明示的な return がされていないルートがある場合にコンパイルエラーにする。

ビルドツール

tsc

Microsoftで開発している公式のツール。

esbuild

xxxx

Discussion