vue-cli4 项目配置

const path = require('path')
const resolve = (dir) => path.join(__dirname, dir); //将文件组成绝对路径
const CompressionPlugin = require("compression-webpack-plugin")
module.exports = {
    "lintOnSave": false,
    productionSourceMap: false,
    publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
    chainWebpack: config => {
        // 添加别名
        config.resolve.alias
            .set('@', resolve('src'))
            .set('assets', resolve('src/assets'))
            .set('components', resolve('src/components'))
    },

    devServer: {
        open: true, // 启动时自动打开浏览器
        proxy: { // 请求的反向代理 解决跨域的问题哦，
          '/api': { // 请求 接口 以 /conner开头，自动匹配
            target: 'https://.....', // 目标地址
            ws: false,
            changeOrigin: true, // 开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
            pathRewrite: { // 路径重写
              '^/api': '/'
            } // 这里重写路径
          }
        }
       
      },

    configureWebpack: config => {
        Object.assign(config.optimization.splitChunks.cacheGroups, {
            'element-ui': { // 分离组件库
                name: true, // name 为true会自动命名
                test: /[\\/]element-ui[\\/]/,
                priority: 10,
                chunks: 'initial'
            },
            jQuery: { // 
                name: 'jQuery',
                test: /[\\/]jquery[\\/]/,
                priority: 6,
                chunks: 'all'
            },
            common: {
                minSize: 0,
                maxSize: 10000,
                name: 'common', //抽取的chunk的名字
                priority: -15, //优先级，一个chunk很可能满足多个缓存组，会被抽取到优先级高的缓存组中
                minChunks: 2, //最少被几个chunk引用
                reuseExistingChunk: true, //  如果该chunk中引用了已经被抽取的chunk，直接引用该chunk，不会重复打包代码
                enforce: true // 如果cacheGroup中没有设置minSize，则据此判断是否使用上层的minSize，true：则使用0，false：使用上层minSize
            }
        })
        if (process.env.NODE_ENV === 'production') {
            // 开启 GZIP
            return {
                plugins: [
                    new CompressionPlugin({
                        test: /\.js$|\.html$|.\css/, //匹配文件名
                        threshold: 10240, //对超过10k的数据压缩
                        deleteOriginalAssets: false //不删除源文件
                    })
                ],
            }
        }
       
    },
    css: {
        loaderOptions: {
            less: {
                globalVars: {
                    hack: `true; @import '~@/assets/b.less';`
                }
            },
        }
    },

};