できない.dev

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 を探索する。
どこで切れているかを順に確認する。

よくある原因

  1. 本体未インストール: ランタイム用パッケージ自体が node_modules に無い
  2. @types/ 未インストール*: ライブラリが型を同梱せず、DefinitelyTyped 経由でしか型が提供されていない
  3. moduleResolution 不一致: 既定の "classic" のまま、または "node16" / "bundler" の解決規則を満たしていない
  4. paths 解決の崩れ: tsconfig.jsonpaths で書いたエイリアス先のファイルが移動・改名された

解決策

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.jsonincludetypeRoots でこの .d.ts が拾われていることを確認する。

3. moduleResolution を現代仕様に

{
  "compilerOptions": {
    "module": "esnext",
    "moduleResolution": "bundler"
  }
}

選択基準は tsconfig の moduleResolution を参照。
Node 単体実行なら "nodenext"、Vite / webpack / esbuild など bundler 経由なら "bundler" を選ぶ。

4. 解決経路の検証

npx tsc --traceResolution > resolve.log

tsc が候補ファイルを順に試すログが出る。
期待した node_modules を見ていなければ pathsbaseUrl の誤りを疑う。

この記事は役立ちましたか?