@tsconfig/strictestで追加されるcompilerOptionsを確認する

技術・テクノロジー

以前 tsconfig/bases の紹介! という記事を読んで、tsconfig/bases の存在を知りました。

このリポジトリで管理されている@tsconfig/strictestを使うことによって、TypeScript の型チェックを 限界まで厳しく してくれるとのこと。

使い方は README にあるように

npm install --save-dev @tsconfig/strictest
yarn add --dev @tsconfig/strictest

でパッケージを入れた後に、tsconfig.jsonに以下を追加するだけです。

"extends": "@tsconfig/strictest/tsconfig.json"

ここで設定されているオプションのうち、中には見慣れないもの多数ありました。


この記事では 2022 年 5 月現在の@tsconfig/strictest/tsconfig.jsonで設定されているcompilerOptionsについて簡単にまとめます。

{
  "compilerOptions": {
    "strict": true,
    "allowUnusedLabels": false,
    "allowUnreachableCode": false,
    "exactOptionalPropertyTypes": true,
    "noFallthroughCasesInSwitch": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noPropertyAccessFromIndexSignature": true,
    "noUncheckedIndexedAccess": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,

    "importsNotUsedAsValues": "error",
    "checkJs": true,

    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Strictest"
}

参考:bases/strictest.json at 5dca640d764beaa9147b2568f24eefc9dbc5ee57 · tsconfig/bases

compilerOptions の一覧

noUnusedParametersより下にあるオプションの中には型の厳格性とはあまり関係なさそうなものもいくつかありましたが、一応記載しています。

strict

"strict": trueにするだけで以下のオプションが有効になります。

  • alwaysStrict
    • "use strict"が付与される
  • strictNullChecks
    • nullundefinedを厳格にチェックする
  • strictBindCallApply
    • bindcallapplyを厳しく型チェックする
  • strictFunctionTypes
    • 関数の引数の変性のチェックを厳しくする
  • strictPropertyInitialization
    • クラスプロパティの初期化を必須にする
  • noImplicitAny
    • 暗黙的なanyをエラーとする
  • noImplicitThis
    • thisの型が暗黙的にanyになる場合エラーとする
  • useUnknownInCatchVariable
    • try-catchcatch (error)error変数の型をunknownにする

Strict - strict | TypeScript: TSConfig Reference - Docs on every TSConfig option

allowUnusedLabels

未使用の ラベル があるときのエラーを抑制できます。

Allow Unused Labels - allowUnusedLabels | TypeScript: TSConfig Reference - Docs on every TSConfig option

allowUnreachableCode

falseの場合、到達不可能なコードを伝えてくれます。

Allow Unreachable Code - allowUnreachableCode | TypeScript: TSConfig Reference - Docs on every TSConfig option

exactOptionalPropertyTypes

オプショナルなプロパティに対してundefinedを渡すことを抑制します。

参考:exactOptionalPropertyTypes によせて - Object.create(null)

exactOptionalPropertyTypes - exactOptionalPropertyTypes | TypeScript: TSConfig Reference - Docs on every TSConfig option

noFallthroughCasesInSwitch

switch文でbreakreturnを厳格に行うように推奨します。

No Fallthrough Cases In Switch - noFallthroughCasesInSwitch | TypeScript: TSConfig Reference - Docs on every TSConfig option

noImplicitOverride

classのメソッドのオーバーライド時にoverrideキーワードの仕様を必須とします。

noImplicitOverride - noImplicitOverride | TypeScript: TSConfig Reference - Docs on every TSConfig option

noImplicitReturns

関数の戻り値の型注釈を必須にします。

No Implicit Returns - noImplicitReturns | TypeScript: TSConfig Reference - Docs on every TSConfig option

noPropertyAccessFromIndexSignature

インデックス型で定義されているプロパティへの参照時にブラケットの仕様を必須とします。

noPropertyAccessFromIndexSignature - noPropertyAccessFromIndexSignature | TypeScript: TSConfig Reference - Docs on every TSConfig option

noUncheckedIndexedAccess

インデックス型のプロパティや配列の要素を参照する際にundefinedチェックを必須とします。

noUncheckedIndexedAccess - noUncheckedIndexedAccess | TypeScript: TSConfig Reference - Docs on every TSConfig option

noUnusedLocals

定義したけど使われていないローカル変数がある場合にエラーを出します。

No Unused Locals - noUnusedLocals | TypeScript: TSConfig Reference - Docs on every TSConfig option

noUnusedParameters

使われていない関数の引数がある場合にエラーを出します。

No Unused Parameters - noUnusedParameters | TypeScript: TSConfig Reference - Docs on every TSConfig option

importsNotUsedAsValues

"error"を指定すると、型をimport typeではなくimportでインポートした際にエラーを出します。

Imports Not Used As Values - importsNotUsedAsValues | TypeScript: TSConfig Reference - Docs on every TSConfig option

checkJs

trueの場合、JavaScript のファイルも型チェックします。

Check JS - checkJs | TypeScript: TSConfig Reference - Docs on every TSConfig option

esModuleInterop

trueにすると、ES Modules と CommonJS の相互運用性が高まります。

参考:TypeScript の esModuleInterop フラグについて - 30歳からのプログラミング

ES Module Interop - esModuleInterop | TypeScript: TSConfig Reference - Docs on every TSConfig option

skipLibCheck

型定義ファイルの型チェックをスキップします。

Skip Lib Check - skipLibCheck | TypeScript: TSConfig Reference - Docs on every TSConfig option

forceConsistentCasingInFileNames

ファイル名の大文字小文字を区別します。

Force Consistent Casing In File Names - forceConsistentCasingInFileNames | TypeScript: TSConfig Reference - Docs on every TSConfig option

感想

この記事を書く前の感想としては、流石に@tsconfig/strictestを有効にすると型チェックが厳しくなりすぎるかな?と思っていたのですが、今は割とどれも有効にしてしかるべきオプションかな、という印象に。

とはいえ、試しに"strict": trueだけ指定されているプロジェクトに@tsconfig/strictestを入れてみた感じ、結構な数のエラーが出てしまったため途中から入れる際は少し覚悟が必要かもしれません(そりゃそうだろ、という感じですが)。

TypeScript に慣れていない人が最初からこのルールをオンにしてコーディングするのは結構しんどいかもしれません。しかし慣れてきた人であればより型の恩恵を受けられて開発体験が上がるはずなので、個人的には今後は積極的に導入していきたいですね。

参考サイト