TypeScript で「Cannot find module ... or its corresponding type declarations」が出る
ライブラリ本体が未インストール、@types/* パッケージが無い、moduleResolution の設定ミスのいずれかが原因。
tsc が node_modules を辿るルールを押さえれば切り分けは早い。
#tsc#types#module#moduleResolution#definitelytyped
公開: 更新:
要約
Cannot find module 'foo' or its corresponding type declarations. は、実体のモジュールか型定義のどちらか(または両方)が tsc から見えない ことを意味する。
tsc は node_modules/<pkg> と node_modules/@types/<pkg>、および tsconfig の paths を探索する。
どこで切れているかを順に確認する。
よくある原因
- 本体未インストール: ランタイム用パッケージ自体が
node_modulesに無い - @types/ 未インストール*: ライブラリが型を同梱せず、DefinitelyTyped 経由でしか型が提供されていない
- moduleResolution 不一致: 既定の
"classic"のまま、または"node16"/"bundler"の解決規則を満たしていない - paths 解決の崩れ:
tsconfig.jsonのpathsで書いたエイリアス先のファイルが移動・改名された
解決策
1. 本体と型を入れる
npm install foo
npm install -D @types/fooライブラリが型同梱(d.ts を含む)なら 2 行目は不要。@types/foo の有無は npm のパッケージページか npm view @types/foo で確認する。
2. 自前の型宣言で塞ぐ
src/types/foo.d.ts:
declare module "foo";DefinitelyTyped にも無い小さなライブラリの暫定対処。tsconfig.json の include か typeRoots でこの .d.ts が拾われていることを確認する。
3. moduleResolution を現代仕様に
{
"compilerOptions": {
"module": "esnext",
"moduleResolution": "bundler"
}
}選択基準は tsconfig の moduleResolution を参照。
Node 単体実行なら "nodenext"、Vite / webpack / esbuild など bundler 経由なら "bundler" を選ぶ。
4. 解決経路の検証
npx tsc --traceResolution > resolve.logtsc が候補ファイルを順に試すログが出る。
期待した node_modules を見ていなければ paths や baseUrl の誤りを疑う。