批量解决vue项目引入组件，文件名大小写出错的问题

问题：vue前端项目，原先在windows环境下编译的，windows环境不区分大小写；现在要在linux环境下编译，区分大小写，所以之前页面引入组件文件名大小写写错的就报错了，导致编译不成功。
解决：尝试不更改代码，统一解决大小写的问题--未解决

1、将组件文件名全部改为小写

2、修改vue.config.js文件，添加以下代码：

chainWebpack: config => {
    config.resolve.extensions.prepend('.vue')
    config.resolve.alias
      .set('@', resolve('src'))
      .set('assets',resolve('src/assets'))
      .set('components',resolve('src/components'))
      .set('views',resolve('src/views'))
      .set('styles',resolve('src/styles'))
      .set('api',resolve('src/api'))
      .set('utils',resolve('src/utils'))
    config.module
      .rule('vue')
      .test(/\.vue$/)
      .use('vue-loader')
        .loader('vue-loader')
        .tap(options => {
          options.transformAssetUrls = {
            'v-img': 'src',
            'v-card': 'src',
            'v-card-media': 'src',
            'v-responsive': 'src',
            'v-carousel-item': 'src',
            'v-hover': 'src'
          }
          return options
        })
  }

3、在package.json文件中添加以下代码：

"vue": {
  "config": {
    "chainWebpack": "chainWebpack"
  }
}

解决办法：

1.在项目根目录的 .env 文件中添加一个变量，告诉 vue-cli 忽略大小写。
例如：

VUE_APP_ESLINT_IGNORE_WARNING=true

2.在项目根目录的 vue.config.js 文件中添加以下代码：

module.exports = {
  chainWebpack: config => {
    config.module.rule('case-insensitive-paths').test(/\.(js|vue)$/i)
      .use('case-sensitive-paths-webpack-plugin')
        .loader('case-sensitive-paths-webpack-plugin')
        .options({
          // 任意值即可
          strict: true
        });
  }
}

3.然后再重新进行编译。

修改引入组件文件名的大小写，保证与实际文件名相同。
希望以上解决方案能帮助你解决问题。

在 Linux 环境下编译前端项目，如果遇到因为大小写问题导致编译不成功的问题，可以考虑以下两种解决方案：

使用文件系统软件：有些文件系统软件，比如 NTFS-3G，能够解决 Windows 和 Linux 文件系统大小写不兼容的问题。可以在挂载 NTFS 分区的时候，使用特定的选项将其设置为忽略大小写。

修改文件名：如果不希望使用文件系统软件，也可以通过修改文件名来解决大小写问题。这可以通过批量修改文件名的方法来实现，比如使用 bash 脚本。请务必修改后验证代码是否正常工作，以确保没有任何错误或兼容性问题。

以上两种方案中，建议使用第二种方案，以保证项目的稳定性和可维护性。

在linux环境下，修改文件名，使文件名的大小写与引用的文件名一致；
在linux环境下，修改编译参数，忽略文件名的大小写；
在windows环境下，修改编译参数，忽略文件名的大小写；
使用工具统一文件名的大小写；
将windows环境的编译参数替换成linux环境的编译参数，以适应linux环境的大小写区分。

一劳永逸的方法使用vscode进行内容的替换。然后进行代码规范

不知道你这个问题是否已经解决, 如果还没有解决的话:

请看👉 ：vue项目打包后字体文件路径出错的解决办法

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^

，重新编译程序。在编译程序的时候，处理忽略大小写的问题。把 windows 下编译的程序文件在 linux 下重新编译，添加参数 -ignore-case，让编译忽略大小写的问题，此时程序在 linux 下有可能编译通过。