🐹

error TS2307: Cannot find module の解決

2024/01/23に公開

発生した問題

既存プロジェクトでCSSModuleを使おうと、import xxx.module.scssしようとしたら以下のエラーが出ました。

モジュール './Button.pc.module.scss' またはそれに対応する型宣言が見つかりません。

ファイルが指定の階層にあることは確認済。

解決方法

declare宣言でmoduleに型情報を追加することで解決しました。
既存の型定義ファイルと同様に、app/javascript/typesにdeclaration.d.tsとしてファイルを追加し、以下を記述します。

app/javascript/types/declaration.ts
declare module '*.scss';

tsconfig.jsonでincludeを指定している場合は、型定義ファイルがコンパイル対象であるかも確認します。なかったら追記します。

エラー消えました🎉🎉🎉

まとめ

型定義ファイルについての理解が乏しいので勉強していきたいと思います。
ts2307のエラー原因はこれ以外にも複数あるため、こちらで解決しない場合は他記事を参考にしてください。

参考

https://qiita.com/crml1206/items/1ffe928339950c4938a4#declare宣言で既存のjavascriptに型情報を追加する

Discussion