コンパイラオプションisolatedModulesの解説を追加する

[suin]

追加する理由

Babelなどのバンドラーと付き合うフロントエンド開発では、isolatedModulesの理解が必須になるため

isolatedModulesはバンドラーのためにあるようなオプション

• バンドラーを使わないならisolatedModules: false(デフォルト)で良い
• Babelのようなバンドラーはtscを使わないので、tscほど型の全容を把握した上で処理してない。
• Babelのようなバンドラーはファイル1個1個、独立して処理する。(importをたどっていったりはしない)
• そのため、型情報が他のファイルから来たものだと、型なのか値なのか分からず処理できない。
• isolatedModulesは、バンドラーが処理できない可能性をtscが忠告してくれる機能。

isolatedModulesと型の再エクスポート

• TypeScriptでは型をexportできる
• バンドラーは型のexportだけを消しながらトランスパイルする。

type T = any;
export { T }; // これはバンドラでも型だと分かる

• 型の再エクスポートは、バンドラーが型なのか値なのか分からず、けしていいか分からなくて困る。

import { T } from "./other-module";
export { T }; // これは型？それとも値？

• export typeと書いてあげることで、バンドラーも型だと分かるようになる。

import { T } from "./other-module";
export type { T }; // これは型だな

• 参考: typescript - Why is export type necessary with --isolatedModules? - Stack Overflow

create-react-appやcreate-next-appで生成されたtsconfig.jsonのisolatedModulesをfalseにしてはいけない

• ReactやNext.jsの雛形生成ツールが吐き出すtsconfig.jsonはisolatedModulesがtrueになってる。
• これはReactやNextが内部でBabelを使っているため。
• isolatedModulesをfalseにしてしまうと、ビルドできなくなってしまう可能生があるので変えないようにしよう