在vue-cli的官网上有所有配置选项的说明，在这只是说明常用的配置选项

1、publicPath

设置项目的打包目录，一般情况下是项目的根目录，如果打包的项目需要放在二级目录下需要在这进行设置

2、outputDir

产品的输出目录 默认的为dist

3、lintOnSave

eslint的检查

4、productionSourceMap

是否暴露出map文件，默认的时候true 虽然这有利于我们调试错误，但是别人能够拿到我们的源码，来分析我们的业务逻辑，不安全。一般建议设置为false

5、configureWebpack

1、如果这个值是一个对象，则会通过 webpack-merge 合并到最终的配置中。
2、如果这个值是一个函数，则会接收被解析的配置作为参数。该函数既可以修改配置并不返回任何东西，也可以返回一个被克隆或合并过的配置版本

6、chainWebpack

函数 修改webpack返回值

7、devServer

配置项目的代理，现在基本上都是前后台分离的开发模式，所以前端 和后台是部署在两个服务器上，我们可以在这设置我们的代理跨域

const path = require('path')
const CompressionPlugin = require('compression-webpack-plugin');
module.exports={
    publicPath: './',  
    // 输出文件目录
    outputDir: 'dist',
    //不展示source-map文件
    productionSourceMap: false, 
    //webpack打包配置 
    chainWebpack: (config) => {
        //去除console.log
        config.optimization.minimizer('terser').tap((args) => {
            args[0].terserOptions.compress.drop_console = true
            return args
          })
          //移除预载插件
        config.plugins.delete('preload')
        //移除预取插件
        config.plugins.delete('prefetch')
        //图片压缩
        config.module
          .rule('images')
          .use('imageWebpackLoader')
          .loader('image-webpack-loader')
          .options({
            disable: process.env.NODE_ENV === 'development', // 开发环境下禁止压缩
            gifsicle: {
              interlaced: false
            }
          })
    },
    configureWebpack: config=>{
        //设置别名
        config.resolve={
          ...config.resolve,
          alias: {
            'vue$': 'vue/dist/vue.esm.js',
            '@': path.resolve(__dirname, './src'),
          }
        },
        //设置不打包的文件
        config.externals= {
          'vue': 'Vue',
          'vue-router': 'VueRouter',
          'vuex': 'Vuex',
          'element-ui': 'ELEMENT',
        }
        //插件配置
        config.plugins = [
          ...config.plugins,
          // 开启 gzip 压缩
          new CompressionPlugin({
            filename: '[path][base].gz',
            algorithm: 'gzip',
            test: /\.js$|\.css$|\.html$/,
            threshold: 10240,
            minRatio: 0.8
          })
        ]
        config["performance"] = {//打包文件大小配置
            "maxEntrypointSize": 10000000,
            "maxAssetSize": 30000000
        }
      },
      devServer: {
        //     open: true,
        //     host: 'localhost',
        //     port: 8080,
        //     https: false,
        //     hotOnly: false,   
        //     // http 代理配置
        //     proxy: {      
        //       '/api': {
        //         target: 'http://127.0.0.1:3000/api',
        //         changeOrigin: true,
        //         pathRewrite: {          
        //             '^/api': ''
        //         }
        //       }
        }
}