vue webpack [HMR] 警告

Question

[HMR] bundle has 2 warnings
client.js?ede2:161 ./src/components/Banner.vue
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:

• D:用户目录我的文档[e-mail]??ref--0!D:用户目录我的文档HBuilderProjectvue-bulingwangpulingwangsrccomponentsBanner.vue

  Used by 6 module(s), i. e.
  D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\node_modules\.6.4.1@babel-loader\lib\index.js!D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\node_modules\.11.3.4@vue-loader\lib\selector.js?type=script&index=0!D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\src\page\bbs\index.vue

• D:用户目录我的文档[e-mail]??ref--0!D:用户目录我的文档HBuilderProjectvue-bulingwangpulingwangsrccomponentsbanner.vue

  Used by 1 module(s), i. e.
  D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\node_modules\.6.4.1@babel-loader\lib\index.js!D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\node_modules\.11.3.4@vue-loader\lib\selector.js?type=script&index=0!D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\src\page\service\serviceDetails.vue

  ./~/.6.4.1@babel-loader/lib!./~/.11.3.4@vue-loader/lib/selector.js?type=script&index=0!./src/components/Banner.vue

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:

• D:用户目录我的文档[e-mail]!D:用户目录我的文档[e-mail]?type=script&index=0!D:用户目录我的文档HBuilderProjectvue-bulingwangpulingwangsrccomponentsBanner.vue

  Used by 1 module(s), i. e.
  D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\node_modules\.11.3.4@vue-loader\index.js??ref--0!D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\src\components\Banner.vue

• D:用户目录我的文档[e-mail]!D:用户目录我的文档[e-mail]?type=script&index=0!D:用户目录我的文档HBuilderProjectvue-bulingwangpulingwangsrccomponentsbanner.vue

  Used by 1 module(s), i. e.
  D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\node_modules\.11.3.4@vue-loader\index.js??ref--0!D:\用户目录\我的文档\HBuilderProject\vue-bulingwang\pulingwang\src\components\banner.vue

Answer 1

我也出了这个问题，也爆了

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.

我排查了一下原因，是因为我写错了一个东西，希望题主能参考一二。
原本我的组件是得这么引的

import SueChooseCity from '@souche-vue/sue-pc/src/components/choosecity';

然而我在单页应用的另外一个页面的一不小心把choosecity写成了chooseCity

import SueChooseCity from '@souche-vue/sue-pc/src/components/chooseCity';

然后就出了这个错。

我看到你的报错信息里有bulingwangpulingwangsrccomponentsbanner和bulingwangpulingwangsrccomponentsBanner。大小写的B的区别，所以问题就出在这里

Answer 2

我补充一种情况。当你排查项目目录大小没有问题，而且模块引入也没有问题的时候，就要考虑一种情况，因为window不区分大小写，lunix区分大小写的，如果我的项目放在桌面上，其实正确的写法应该是Desktop,你cd desktop没有问题，但是当你run dev的时候

dev C:\Users\Administrator\desktop\egaga-org\egagag-org

两种方案：
1，所以不妨试试 cd Desktop，其他盘符类似
2，直接用cmd 不用git bash

Answer 3

我的是盘符小写了 就出线这样的警告

Answer 4

楼主，我也遇到了这个问题，解决了吗？

Answer 5

组件的name属性要用camelCase写法命名

Answer 6

遇到过几次这个报错，最终都是因为引入组件的时候，文件名大小写拼错了。检查下。