TypeScriptサーバーが反応しなくなったとき複雑なReactやNext.jsプロジェクトの作業中、突然エディタが反応しなくなることがあります。構文ハイライトが消え、エラーの赤線も表示されず、変数にホバーしても何も起こりません。そして、右下に恐ろしい通知が表示されます。
TypeScript server quit unexpectedly. This may be due to a bug or very large TypeScript project.
これは、IntelliSense、型チェック、ナビゲーションを支えるバックグラウンドプロセスであるtsserverがクラッシュしたことを意味します。通常、プロセスがメモリ上限(デフォルトでは約3GB)に達したとき、再帰的な型のループに陥ったとき、またはワークスペースとエディタ間のバージョン不一致が発生したときに起こります。
クイック修正:強制再起動まだ設定ファイルをいじる必要はありません。単純な再起動だけで、ハングしたプロセスやブランチの切り替えによる一時的な不具合が解消されることがよくあります。
- コマンドパレットを開きます(Macでは
Cmd+Shift+P、WindowsではCtrl+Shift+P)。- **「Restart TS Server」**と入力します。- TypeScript: Restart TS Serverを選択します。数秒以内にサーバーが再びクラッシュする場合は、リソースのボトルネックや設定の競合が発生している可能性があります。
TSサーバーのメモリ制限を増やす大規模なモノレポや数千ものファイルがあるプロジェクトでは、デフォルトのメモリ割り当てを簡単に使い果たしてしまいます。16GBまたは32GBのRAMを搭載している場合は、制限を8GBに引き上げてサーバーに余裕を持たせましょう。
メモリ設定の変更方法:- VS Codeの設定を開きます(Cmd+,)。- typescript.tsserver.maxTsServerMemoryを検索します。- 値をデフォルトから8192に変更します。あるいは、プロジェクト固有の設定にするために、以下の内容を直接.vscode/settings.jsonファイルに記述することもできます。
{
"typescript.tsserver.maxTsServerMemory": 8192
}
TypeScriptのバージョンを同期するVS Codeには独自のTypeScriptバージョンが付属していますが、プロジェクトはおそらくnode_modulesにインストールされた特定のバージョンに依存しています。ここでの不一致は、不安定さを招く典型的な原因です。常にワークスペースのバージョンを使用するようにしましょう。
- 任意の
.tsまたは.tsxファイルを開きます。- 下部のステータスバーを確認します。{ }アイコンの横にあるバージョン番号をクリックします。- ドロップダウンから**「ワークスペースのバージョンを使用(Use Workspace Version)」**を選択します。これにより、エディタはビルドスクリプトで使用されているものと全く同じコンパイラバージョンを使用するようになり、組み込みバージョンがまだ理解できない新しい構文によるクラッシュを防ぐことができます。
重いフォルダをインデックス対象から除外するTypeScriptサーバーは、distやbuild、あるいは膨大なドキュメントディレクトリなど、触れる必要のないフォルダをインデックスしようとして消耗している可能性があります。tsconfig.jsonの設定を絞り込むことで、サーバーの負荷を劇的に軽減できます。
exclude配列に、ソース以外のすべてのディレクトリが含まれていることを確認してください。
{
"compilerOptions": {
// ... オプション
},
"exclude": ["node_modules", "dist", "build", ".next", "out", "coverage"]
}
大規模なプロジェクトでは、ワークスペース設定を更新して、特定のパターンを完全にウォッチしないようにVS Codeに指示することもできます。
{
"typescript.tsserver.watchedFile": "dynamicPriorityPolling",
"files.exclude": {
"**/.git/objects/**": true,
"**/node_modules/*/**": true
}
}
キャッシュを削除して再インストールする破損したロックファイルや、整理されていないnode_modulesフォルダが原因であることがあります。サーバーの調子が改善しない場合は、クリーンな状態にリセットするのが最も確実な方法です。
# 依存関係とロックファイルを削除
rm -rf node_modules package-lock.json pnpm-lock.yaml yarn.lock
# 新規インストール
npm install
TypeScriptのキャッシュもクリアする必要があります。macOSでは~/Library/Caches/TypeScriptを削除します。Windowsでは%AppData%\Local\Microsoft\TypeScriptの中身を消去します。これにより、サーバーはインデックスをゼロから再構築せざるを得なくなります。
ログを調査するまだクラッシュしますか?出力パネルは、エディタの内部エラーを確認するための「ブラックボックス」として機能します。サーバーが停止した正確な理由を教えてくれます。
- 「出力(Output)」タブを開きます(
表示 > 出力)。- 右側のドロップダウンメニューからTypeScriptを選択します。-FATAL ERROR: Ineffective mark-compacts near heap limitというメッセージを探します。ログが特定のファイルを指している場合は、そのファイルに複雑な再帰型や無限ループがないか確認してください。たった一つの「巧妙な」型定義が、サーバー全体をクラッシュさせることがあります。

