Question

我正在使用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

令人困惑的是，＆＃39;两个＆＃39;引用的文件只是一个文件 - 目录中没有两个文件，其名称仅在大小写上有所不同。

我还注意到，如果受到这些警告影响，我的热重新加载器通常不会对文件进行更改。

可能导致此问题的原因是什么？

Answer 1

这通常是一个微不足道的错字的结果。

如果您要导入模块，例如import Vue from 'vue'，import Vuex from 'vuex'。

浏览您的文件并查看您使用的位置from 'Vue'或from 'Vuex'

错误描述应该写得更清楚了，但我解释的是每次在webpack命令上出现此错误时我的问题的原因。

Answer 2

对于其他遇到此问题并没有运气尝试建议的修复程序的人，这是另一种可能的修复程序。

请确保您在终端中使用的路径具有正确的大小写。例如，如果您在Windows上使用git bash并且您的项目具有以下路径：

C:\MyProjects\project-X

如果使用cd /c/myprojects/project-x（请注意缺少大写字母）访问它，然后运行npm start，则可能会遇到此问题。

解决方案是考虑项目路径区分大小写，并按以下方式使用它：

cd /C/MyProjects/project-X

Answer 3

在角度6发生在我身上。您的IDE或文本编辑器可能会忽略这是大写和小写字母误用错误。我使用

import { PayComponent }      from './payment/pay/pay.component';

代替

import { PayComponent }      from './Payment/pay/pay.component';

想象一下“ P”和“ p”。祝你好运。

Answer 4

当我尝试在窗口计算机上的vscode终端中运行npm start时，会发生此问题。问题是/desktop/flatsome而不是/Desktop/flatsome，只是在vscode终端中将路径改为大写D到桌面，而小写d到桌面

Answer 5

OMG我终于找到了解决问题的方法。

我正在使用 VS Code终端，并且在提示路径中使用的是桌面而不是桌面：

C:\Users\Hans\desktop\NODE JS\mysite>

要修复它，我只需要关闭项目文件夹并重新打开它即可：

File -> Close Folder
File -> Open Folder

现在VS Code终端正在使用正确的提示路径。

Answer 6

我在Angle 6项目中遇到了同样的问题。

发生此问题的原因是，在模块之类的组件中导入组件

import { ManageExamComponent } from './manage-Exam.component';

我写过像manage-Exam一样的考试，考试用大写字母写成，而webpack理解小写字母。

我一经使用

import { ManageExamComponent } from './manage-exam.component';

少量使用过的考试，并且已解决问题。

Answer 7

如果有人在使用 vue-styleguidist 时遇到这个问题，那么这 github issue 为我解决了问题。

Answer 8

我遇到了同样的问题，因为我将项目文件夹的名称更改为“ Myclass”，而由于某些原因，在git bash中将其命名为“ myclass”。当我更改为小写的“ m”时，消息停止了。

Answer 9

这些解决方案都不适合我。什么是：

删除有问题的文件（但是将它们备份到其他位置！）。
将更改提交到Git。
再次从备份中添加相同的文件。
将新文件提交给Git ...问题解决了！

就我而言，我只是更改了包含导入模块的文件名的大小写。它们在文件系统（OSX Finder，Bash）和代码编辑器（VS Code）中显示为小写。但是，以VS代码打开文件仍在代码编辑器选项卡中显示了旧文件名。我尝试完全删除文件，然后重新添加它们。这不起作用-新添加的文件仍在编辑器选项卡中显示旧名称，而我的构建仍在中断。

然后，经过数小时徒劳的修复尝试，我发现Git不会将对文件大小写的更改视为更改，因此它实际上从未更改过这些文件名：

How do I commit case-sensitive only filename changes in Git?

因此，我删除了有问题的文件，提交给Git，重新添加了文件并重新提交了-并且它起作用了。没有警告，并且构建错误也消失了。

Answer 10

如果next.js链接（进入React）中出现此错误：

import Link from 'next/Link'

代替

import Link from 'next/link'

Answer 11

我遇到了同样的问题，然后发现我的vue文件以小写命名，如下所示：event.vue。为了解决它，我将其重命名为Event.vue并在导入它的位置进行了更新，然后它开始工作。对于import语句，它看起来像这样：

之前

从'@ / components / NewsAndEvents / event'导入事件重命名文件后，它必须如下所示：

从'@ / components / NewsAndEvents / Event'导入事件

Answer 12

同样的问题发生在我身上，试试这个 cli git config --global core.ignorecase false。它可能是 Git 设置的区分大小写的配置。对我来说，一切都在没有任何警告的情况下运行。

Answer 13

我在 Vue.js 中遇到了同样的问题。最终事实证明，我在两个位置导入了具有不同名称空间的组件。

import Step1 from '~/Components/Application/Step1'

import Step1 from './Step1'

通过将第二个更改为：

import Step1 from '~/Components/Application/Step1'

希望对您有所帮助...

Answer 14

我们用 webpack 解决了这个问题。将 entry 传递给 webpack 时，我们使用了 path.resolve("./abc.ts")。这是根据当前终端路径解析相对浴。我们通过解析相对于当前目录的路径来解决这个问题。 path.resolve(__dirname, './abc.ts');

Answer 15

就我而言，我错误地进行了两次导入：

UTF-8

Answer 16

为我解决的问题（在下一个 js 上）是将目录名称更改为小写：

来自： var audioPlayer: AVAudioPlayer? func playSound(sound: String, type: String) { if let path = Bundle.main.path(forResource: sound, ofType: type) { do { audioPlayer = try AVAudioPlayer(contentsOf: URL(fileURLWithPath: path)) audioPlayer?.play() } catch { print("ERROR") } } } // Some code here playSound(sound: "resume", type: "m4a")。

致： /src/Components/NavBar/MainMenuItemMobile.js。

Answer 17

简单地重命名您的文件夹，然后输入 npm start 重试

Answer 18

我正在使用 Jetbrains Webstorm（在 Windows 上）并且我的运行配置中 package.json 的路径大小写错误。

~\Projects\x\XWebsite\package.json

->

~\projects\x\XWebsite\package.json

Answer 19

如果您使用的是 VS Code ，并且您正在执行“ npm run dev ”，但是在VS中未打开相应的项目文件夹编码，然后将出现这些 3警告。

解决方案是：首先打开相应的项目文件夹，然后仅执行“ npm run dev”

Answer 20

// waring
import Test from './TestHome'
// you can rename your file with camel-case and import
import Test from './test-home'
// or you should fix the path 
import Test from '@/views/TestHome'

希望这两种方法都能解决您的问题。

Answer 21

是的，如果您使用的名称相同但大小写已更改，则会发生这种情况：例如，您曾经

import React from 'React'

代替

import React from 'react'

Answer 22

字母驱动器的大小写也很重要。就我而言，Windows 10文件中的字母为大写“ C”，而我文件中的小写为“ c”。

Answer 23

我也有同样的问题。我导航到目录Trade_v3，而实际目录为Trade_V3。更改目录后，不会引发此错误。

Answer 24

我们在Windows上运行React，我的一位开发人员看到了这一点，但没有其他人遇到问题。

我看着他们打开VS Code到项目的子目录，然后对项目目录进行小写cd（而不是实际的大小写混合），然后运行npm start。

您实际上可以在终端中以c:\someproject\somedir的形式看到目录名称的小写字母，但在Windows资源管理器中则为c:\SomeProject\SomeDir。

我很惊讶Windows命令终端允许您执行此操作。

Answer 25

就我而言（Win7，VSCode，Angular 6），即使在所有地方都修复了错误的案例路径之后，问题仍然存在。看起来像webpack以某种方式缓存路径，所以解决它：

重命名引起问题的文件夹或文件
构建
错误
重命名
构建
成功

Answer 26

如果您在Visual Studio Code和Gitbash中看到此消息，请转到设置并搜索C：\（大写C），然后将Gitbash.exe的路径更改为c：\，它将消失。 >

Answer 27

我遇到了同样的问题，我将我的react文件夹命名为 UI ，并且webpack生成的路径以某种方式使其变为小写。

因此，我将其重命名为 ui ，即用小写字母代替了 UI 马上。

谢谢。

Answer 28

类似的问题，但是我的问题是在C:\Users\<username>\AppData\Local\Yarn中安装了软件包。删除该文件夹并重新添加全局软件包，我想解决此问题。

Answer 29

我有类似的错误，但与其他答案所描述的不完全相同。我希望我的回答可以对某人有所帮助。

我正在导入两个组件中的文件（Angular 7项目）：

组件1：

LANGUAGES = require("../../models/LANGUAGES.json");

组件2：

LANGUAGES = require("../../models/LANGUAGES.JSON");

这是一个愚蠢的错误：这里的问题是我在同一个文件上使用两个不同的要求，这些文件使用不同的大写字母（它会生成警告）。

如何解决问题？使用相同的模型。

组件1：

LANGUAGES = require("../../models/LANGUAGES.json");

组件2：

LANGUAGES = require("../../models/LANGUAGES.json");

OR

组件1：

LANGUAGES = require("../../models/LANGUAGES.JSON");

组件2：

LANGUAGES = require("../../models/LANGUAGES.JSON");

Answer 30

我也有这个警告，但是我的问题是，例如，有一个React项目的文件目录：

**/src/containers/PageOne/index.js
**/src/containers/PageTWO/pageOneAction.js

**/src/containers/PageOne/index.js
**/src/containers/PageTWO/pageTWOAction.js

并且会有类似的警告。因为最好不要使用除action.js以外的相同文件名（例如这些文件夹中的index.js），否则在具有其他大小写语义的文件系统上进行编译时，这可能导致意外的行为。 / p>

要解决此警告，我们可以这样做：

**/src/containers/PageOne/index.js
**/src/containers/PageOne/pageOneAction.js

**/src/containers/PageTWO/index.js
**/src/containers/PageTWO/pageTWOAction.js

这是我的经验，希望它能对某人有所帮助。

Webpack：＆＃34;有多个模块的名称只有外壳和＃34;但引用的模块是相同的

30 个答案: