Vue2升级Vue3遇模块大小写差异警告，求解决方案

API 探路者

2026-8-1

升级Vue2到Vue3后出现SVG颜色大小写导致的编译警告问题

我正在将旧代码仓库从Vue2升级到Vue3，修复完其他错误警告后，仍存在两个编译警告，提示多个模块仅大小写不同。

编译警告详情如下：

WARNING  Compiled with 2 warnings                                                                                                                                                    10:39:23

 warning  in data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1 1%27%3E%3Cpath style=%27fill:%23FFF%27 d=%27M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z%27%3E%3C/path%3E%3C/svg%3E

存在多个仅大小写不同的模块。
这会在区分大小写的文件系统编译时导致意外行为。
请统一大小写。对比以下模块标识符：
* asset/inline|data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1 1%27%3E%3Cpath style=%27fill:%23FFF%27 d=%27M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z%27%3E%3C/path%3E%3C/svg%3E
    被1个模块引用，例如：
    C:\dev\secdem\control\node_modules\@vue\cli-service\node_modules\css-loader\dist\cjs.js??clonedRuleSet-22.use[1]!C:\dev\secdem\control\node_modules\vue-loader\dist\stylePostLoader.js!C:\dev\secdem\control\node_modules\@vue\cli-service\node_modules\postcss-loader\dist\cjs.js??clonedRuleSet-22.use[2]!C:\dev\secdem\control\node_modules\sass-loader\dist\cjs.js??clonedRuleSet-22.use[3]!C:\dev\secdem\control\node_modules\vue-loader\dist\index.js??ruleSet[0].use[0]!C:\dev\secdem\control\src\App.vue?vue&amp;type=style&amp;index=0&amp;id=7ba5bd90&amp;lang=scss
* asset/inline|data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1 1%27%3E%3Cpath style=%27fill:%23fff%27 d=%27M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z%27%3E%3C/path%3E%3C/svg%3E
    被2个模块引用，例如：
    C:\dev\secdem\control\node_modules\@vue\cli-service\node_modules\css-loader\dist\cjs.js??clonedRuleSet-14.use[1]!C:\dev\secdem\control\node_modules\@vue\cli-service\node_modules\postcss-loader\dist\cjs.js??clonedRuleSet-14.use[2]!C:\dev\secdem\control\node_modules\buefy\dist\buefy.css

 warning  in data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1 1%27%3E%3Crect style=%27fill:%23FFF%27 width=%270.7%27 height=%270.2%27 x=%27.15%27 y=%27.4%27%3E%3C/rect%3E%3C/svg%3E

存在多个仅大小写不同的模块。
这会在区分大小写的文件系统编译时导致意外行为。
请统一大小写。对比以下模块标识符：
* asset/inline|data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1 1%27%3E%3Crect style=%27fill:%23FFF%27 width=%270.7%27 height=%270.2%27 x=%27.15%27 y=%27.4%27%3E%3C/rect%3E%3C/svg%3E
    被1个模块引用，例如：
    C:\dev\secdem\control\node_modules\@vue\cli-service\node_modules\css-loader\dist\cjs.js??clonedRuleSet-22.use[1]!C:\dev\secdem\control\node_modules\vue-loader\dist\stylePostLoader.js!C:\dev\secdem\control\node_modules\@vue\cli-service\node_modules\postcss-loader\dist\cjs.js??clonedRuleSet-22.use[2]!C:\dev\secdem\control\node_modules\sass-loader\dist\cjs.js??clonedRuleSet-22.use[3]!C:\dev\secdem\control\node_modules\vue-loader\dist\index.js??ruleSet[0].use[0]!C:\dev\secdem\control\src\App.vue?vue&amp;type=style&amp;index=0&amp;id=7ba5bd90&amp;lang=scss
* asset/inline|data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1 1%27%3E%3Crect style=%27fill:%23fff%27 width=%270.7%27 height=%270.2%27 x=%27.15%27 y=%27.4%27%3E%3C/rect%3E%3C/svg%3E
    被2个模块引用，例如：
    C:\dev\secdem\control\node_modules\@vue\cli-service\node_modules\css-loader\dist\cjs.js??clonedRuleSet-14.use[1]!C:\dev\secdem\control\node_modules\@vue\cli-service\node_modules\postcss-loader\dist\cjs.js??clonedRuleSet-14.use[2]!C:\dev\secdem\control\node_modules\buefy\dist\buefy.css

从警告信息可以看出，差异来自SVG填充色的大小写——#FFF和#fff，但我在项目内搜索不到对应的内容，检查了所有导入语句和路径也没发现异常。目前使用的是兼容Vue3的非官方Buefy分支，不知道该怎么解决这个问题。

内容的提问来源于stack exchange，提问作者Tim Schumacher