webpack · npm
メッセージ
Module not found: Error: Can't resolve './components/Button' in '/app/src'
何を意味するか
束ね役がその経路にそのファイルを見つけられなかったという意味です。これは package ではなく自分が書いた import です。相対経路が一段ずれている、拡張子が抜けているか誤っている、ファイル名の大文字小文字が import と違う、といったときに出ます。最後のものが最も厄介で、macOS と Windows のファイルシステムは大文字小文字を区別しないため、自分の機械では動き Linux の CI でだけ壊れます。そのディレクトリを ls で出し、import と一文字ずつ、大文字小文字まで照らし合わせます。名前が経路ではなく package なら入れれば済み、どちらの場合も消えるものはありません。
直しかた
一行の命令では終わりません。何を見るべきかを説明に書いてあります。
- 出す道具
- webpack
- npm
- 20
npm では原因は最後の六行ではなく最初の code XXXX の一行に書かれており、失敗が自分のコードではなく依存関係の木やネイティブビルドから来ている場合は、node_modules を消して入れ直すだけで半分は解けます。
エラーメッセージの読み方
- 一行目から読みます。下に行くほど道具の内部の話で、原因はたいてい一番上に書かれています。
- ファイル名と行番号があればそこが出発点です — スタックの最上段ではなく、自分が書いたファイルが出てくる一番上の行です。
- 文句はそのまま検索します。ただし自分のパスや変数名は消します — その部分が検索を邪魔します。
- 同じ事情が道具の版ごとに違う言い方で出ます。結果が合わないときは版番号も入れてみます。
- 直す命令を貼る前に、その命令が何を捨てるかを確かめます。取り消せないものが混ざっています。
よくある質問
Q. Module not found: Error: Can't resolve './components/Button' in '/app/src' はどういう意味ですか。
束ね役がその経路にそのファイルを見つけられなかったという意味です。これは package ではなく自分が書いた import です。相対経路が一段ずれている、拡張子が抜けているか誤っている、ファイル名の大文字小文字が import と違う、といったときに出ます。最後のものが最も厄介で、macOS と Windows のファイルシステムは大文字小文字を区別しないため、自分の機械では動き Linux の CI でだけ壊れます。そのディレクトリを ls で出し、import と一文字ずつ、大文字小文字まで照らし合わせます。名前が経路ではなく package なら入れれば済み、どちらの場合も消えるものはありません。
Q. どう直しますか。
一行の命令では終わりません。何を見るべきかを上の説明に書いてあります。
Q. どの道具が出すエラーですか。
webpack です。npmの仲間で、文句は9語です。