在vue-cli的官網(wǎng)上有所有配置選項的說明，在這只是說明常用的配置選項

1、publicPath

設置項目的打包目錄，一般情況下是項目的根目錄，如果打包的項目需要放在二級目錄下需要在這進行設置

2、outputDir

產(chǎn)品的輸出目錄 默認的為dist

3、lintOnSave

eslint的檢查

4、productionSourceMap

是否暴露出map文件，默認的時候true 雖然這有利于我們調(diào)試錯誤，但是別人能夠拿到我們的源碼，來分析我們的業(yè)務邏輯，不安全。一般建議設置為false

5、configureWebpack

1、如果這個值是一個對象，則會通過 webpack-merge 合并到最終的配置中。
2、如果這個值是一個函數(shù)，則會接收被解析的配置作為參數(shù)。該函數(shù)既可以修改配置并不返回任何東西，也可以返回一個被克隆或合并過的配置版本

6、chainWebpack

函數(shù) 修改webpack返回值

7、devServer

配置項目的代理，現(xiàn)在基本上都是前后臺分離的開發(fā)模式，所以前端 和后臺是部署在兩個服務器上，我們可以在這設置我們的代理跨域

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', // 開發(fā)環(huán)境下禁止壓縮
            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': ''
        //         }
        //       }
        }
}