vue.config 同时配置 chainWebpack和关闭eslint检查多个配置项目共存

coldriversnow

已于 2022-11-11 17:27:42 修改

阅读量1k

点赞数

文章标签： vue.js javascript 前端

于 2022-11-11 17:25:50 首次发布

本文链接：https://blog.csdn.net/coldriversnow/article/details/127809973

版权

这篇博客分享了在Vue项目中遇到的组件命名规范问题及解决跨域配置的步骤。首先，针对Vue组件名应为多单词的错误，作者找到了解决方案。接着，详细介绍了在开发服务器中设置代理以解决API请求的跨域问题，包括端口设定、代理配置、路径重写等关键步骤。然而，在实际操作中，作者遇到了如何合并多个`module.exports`的问题，博客最后展示了两种不同的配置代码，但未给出最终解决办法。

摘要由CSDN通过智能技术生成

大家可能会遇到和我一样的问题，所以我把它写出来

一开始你可能遇到这个问题：

vue报错：Component name “xxx“ should always be multi-word

于是你去网上搜索，发现解决问题的方法是

之后你继续做需要解决跨域问题是这样的

module.exports = {
   "devServer": {                //记住，别写错了devServer//设置本地默认端口选填
       port: 8085,
       proxy: {                 //设置代理，必须填
           '/api': {              //设置拦截器拦截器格式   斜杠+拦截器名字，名字可以自己定
               target: 'http://localhost:8081',     //代理的目标地址
               changeOrigin: true,              //是否设置同源，输入是的
               pathRewrite: {                   //路径重写
                   '^/api': ''                     //选择忽略拦截器里面的内容
               }
           }
       }
   },

由于你是小白，你决定直接cv上去就会写成下面的这个样子

之后你会发现第二个module.exports覆盖第一个module.exports，事实上如何让两个module.exports中的内容同时生效呢？

多个配置代码如下

module.exports = {
    baseUrl: './',
    assetsDir: 'static',
    parallel: false,
    productionSourceMap: false,
    devServer: {
        host:'localhost',
        port:'8081',
        open:true
    },
}
const path = require("path");
function resolve(dir) {
    return path.join(__dirname, dir);
}

module.exports = {
    publicPath: './',
    chainWebpack: config => {
        config.resolve.alias
            .set('@', resolve('src'))
            .set('utils', resolve('src/utils'))
            .set('assets', resolve('src/assets'))
            .set('common', resolve('src/components'));
    },
    configureWebpack: (config) => {
        if (process.env.NODE_ENV === 'production') {// 为生产环境修改配置...
            config.mode = 'production';
            config["performance"] = {//打包文件大小配置
                "maxEntrypointSize": 10000000,
                "maxAssetSize": 30000000
            }
        }
    },
    transpileDependencies: true,
    lintOnSave: false, //关闭eslint检查
};