[解決済み】Webpack: 「ケーシングが異なるだけの名前のモジュールが複数存在する」しかし参照されるモジュールは同一である

質問

webpack 3.8.1を使用していますが、以下のようなビルド時の警告を何度か受けています。

WARNING in ./src/Components/NavBar/MainMenuItemMobile.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* /Users/path/to/babel-loader/lib/index.js!/Users/path/to/NavBar/MainMenuItemMobile.js
    Used by 1 module(s), i. e.
    /Users/path/to/babel-loader/lib/index.js!/Users/path/to/NavBar/ConstructedMainMenuItems.js
* /Users/path/to/babel-loader/lib/index.js!/Users/path/to/Navbar/MainMenuItemMobile.js
    Used by 1 module(s), i. e.
    /Users/path/to/babel-loader/lib/index.js!/Users/path/to/Navbar/ConstructedMainMenuItems.js
.....
(webpack)-hot-middleware/client.js ./src/index.js

紛らわしいのは、参照されている「2つの」ファイルは1つのファイルであり、ディレクトリ内に大文字と小文字だけが異なる名前のファイルは2つ存在しないことです。

また、私のホットリローダは、これらの警告の影響を受けると、しばしばファイルの変更を拾えなくなることに気づきました。

この問題は何が原因なのでしょうか？

解決方法は？

これは通常、極小のタイプミスの結果です。

例えば、以下のようにモジュールをインポートしているとします。 import Vue from 'vue' , import Vuex from 'vuex' .

あなたのファイルを調べて、どこで from 'Vue' または from 'Vuex' - は、import文と全く同じ大文字（英大文字）を使ってください。

エラーの説明はもっとわかりやすく書くべきでしたが、説明したことが、webpackコマンドのこのエラーの原因として毎回問題になっています。