Vue-cli3 + Webpack 4 打包优化

配置生产环境不产生sourceMap和去除Degugger 以及 console

Vue.config配置下写入：

devtool     : 'none', // 不生成sourceMap
  optimization: {
    minimize : true,
    minimizer: [
      (compiler) => {
        const TerserPlugin = require('terser-webpack-plugin')
        new TerserPlugin({
          cache        : true,
          parallel     : true,
          terserOptions: {
            compress: {
              drop_debugger: true, // console
              drop_console : true, // 注释console
              pure_funcs   : ['console.log'] // 移除console， 必须和上一条同时使用才能去除console
            }
          }
        }).apply(compiler)
      }
    ]
  }

也可以分开配置文件，通过环境变量引入vue.config.js

const pro = require('./config/webpack.pro.ts')
const dev = require('./config/webpack.dev.ts')

let config = {}
switch (process.env.NODE_ENV) {
  case 'pro':
    config = pro
    break
  default :
    config = dev
}

module.exports = {
  configureWebpack: {
    devtool     : config.devtool,
    optimization: config.optimization
  }
}