Vue-cli4打包配置

 首先：在vue-cli3 以后我们修改webpack配置需要自己手动在根目录下创建   "vue.config.js" 文件

//加载path模块
const path = require('path')
    //定义resolve方法，把相对路径转换成绝对路径
const resolve = dir => path.join(__dirname, dir)

module.exports = {
    productionSourceMap: false, //去除生产环境的productionSourceMap
    publicPath: "./", // 配置公共路径(必须要有)
    outputDir: "dist", // 输出文件目录
    assetsDir: "assets", // 静态资源存放的文件夹(相对于ouputDir)
    lintOnSave: false, // eslint-loader 是否在保存的时候检查
    productionSourceMap: false, // 不需要生产环境的设置false可以减小dist文件大小，加速构建
    devServer: { // 对vue-cli-serveice 微服务器进行配置
        open: true, // 自动开启浏览器
        port: 8080, // 开发服务器运行端口号
        hotOnly: false, // 热更新
        host: "0.0.0.0", // 匹配本机IP地址(默认是0.0.0.0)

        // 每当编译器出现错误或警告时，在浏览器中显示全屏覆盖
        overlay: {
            warnings: false, // 警告
            errors: false //错误
        },

        // 配置跨域
        proxy: {
            '/api': {
                target: 'http', //接口的域名
                // ws: true, // 是否启用websockets
                changOrigin: true, // 开启代理，在本地创建一个虚拟服务端
                pathRewrite: {
                    '^/api': '/'
                }
            }
        }
    },
    chainWebpack: config => {
        // 添加别名
        config.resolve.alias
            .set('@', resolve('src'))
            .set('assets', resolve('src/assets'))
            .set('api', resolve('src/api'))
            .set('views', resolve('src/views'))
            .set('components', resolve('src/components'))
    },
}