tsconfig.jsonの設定

概要

TSファイルをJSファイルにコンパイルするための設定ファイルです。TSプロジェクトのルートディレクトリにtsconfig.jsonを設置します。tsconfig.jsonが存在するディレクトリは、ルートディレクトリです。tsconfig.jsonにはルートファイルとプロジェクトをコンパイルするのに必要なコンパイラのオプションを設定します。

tsconfig.jsonの実行

入力ファイルを指定せずにtscを実行します。
microsoft/TyeScriptのpackage.jsonに以下の記載がありました。

    "bin": {
        "tsc": "./bin/tsc",
        "tsserver": "./bin/tsserver"
    },

※間違っていたらすみません。

tsconfig.jsonのオプション

全オプションは多岐にわたるので、個人的に今回使用する分を記していきます。

tsconfig.json

{
  "compilerOptions": {
    "target": "es2021",
    "module": "esnext",
    "moduleResolution": "node",
    "jsx": "react",
    "strict": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true
  }
}

compilerOptions

コンパイルする際のオプションです。ここにオプションを書いていきます。

target

どのバージョンでjsを出力するのか指定します。指定するバージョンはnode.greenで確認します。node -vでバージョンを確認して調べます。v18.15.0だとES2021が100%対応していましたので、今回は指定しています。

module

出力するjsのモジュールの仕組みとして何を使用するかを指定する。
※ECMA Script ESNext ＝ 未来のJavaScript。まだ実質使えないものも含めた、来年出る最新のECMAScriptのバージョンを ESNextと呼ぶようです。

moduleResolution

tscのモジュール解決の方法を指定します。

jsx

tsxファイルをjsxやjsにコンパイルする際の出力の形式を指定します。

strict

strict自体は特定の機能を有効にするものではないです。このオプションをtrueにすると、下記のオプションが全てtrueになります。

--noImplicitAny
--noImplicitThis
--alwaysStrict
--strictBindCallApply
--strictNullChecks
--strictFunctionTypes
--strictPropertyInitialization

forceConsistentCasingInFileNames

import時にファイルパスの文字列で大文字小文字を区別するかどうかを指定します。
デフォルトfalseです。

参考