【Cannot find module ... or its corresponding type declarations.】 tsconfig.json がプロジェクトのルート直下にない場合

事の発端

inject の戻り値の型が正しく返らず unknown になってる。

そういえば import する時にエラーを吐いてる。

Cannot find module ... or its corresponding type declarations

こいつが原因か？

しかし、なぜ Cannot find module になるか分からない...

原因

自分の場合だと Rails プロジェクトの上に frontend ディレクトリを作り、tsconfig.json を置いていたのでこのような状況に陥った。そして、プロジェクトのルート直下で VSCode を開いていたため、tsconfig.json の内容がうまく機能していなかった。

フォルダ構成は以下のような感じ。

.
├── Gemfile
├── Gemfile.lock
└── frontend
  └── tsconfig.json
  └── components
...

解決

frontend ディレクトリ配下で VSCode を開いても解決するのだが、ルート直下に tsconfig.json を置いても解決する。extend でファイルパスを指定することで、継承する tsconfig.json を指定できる。

tsconfig.json

{
  "extends": "./frontend/tsconfig.json"
}

参考リンク