vue-config.js优化

在vue-config.js中对vue项目进行优化

const path = require('path') 
const CompressionPlugin = require("compression-webpack-plugin");
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const HardSourceWebpackPlugin = require('hard-source-webpack-plugin');
function resolve(dir) {
  return path.join(__dirname, dir)
}

module.exports = {
    lintOnSave: false,
    productionSourceMap: false,
    outputDir:process.env.NODE_ENV === 'production'?'dist':'test',
    devServer:{
      proxy:'http://test_mms_api.dxanm.com'
    },
    configureWebpack: config => {
        config.plugins.push(new HardSourceWebpackPlugin())
        return {
          optimization: {
            minimizer: [
              new UglifyJsPlugin({
                uglifyOptions: {
                    output: {
                      comments: false, // 去掉注释
                    },
                    compress: {
                        drop_console: true, //生产环境自动删除console
                        drop_debugger: false,
                        pure_funcs: ['console.log'] //移除console
                    },
                    warnings: false,
                },
                sourceMap: false,
                parallel: true,//使用多进程并行运行来提高构建速度。默认并发运行数：os.cpus().length - 1。
            })
            ],
          }
        }
    },
    chainWebpack: config => {
      config.resolve.alias
        .set('@', resolve('src'))
        .set('assets', resolve('src/assets'))
        .set('components', resolve('src/components'))
      // 解决ie11兼容ES6
      config.entry('main').add('babel-polyfill')
      // 开启图片压缩
      config.module.rule('images')
      .test(/\.(png|jpe?g|gif|svg)(\?.*)?$/)
      .use('image-webpack-loader')
      .loader('image-webpack-loader')
      .options({ bypassOnDebug: true })
      // 开启js、css压缩
        config.plugin('compressionPlugin')
        .use(new CompressionPlugin({
          test:/\.js$|\.html$|.\css/, // 匹配文件名
          threshold: 10240, // 对超过10k的数据压缩
          deleteOriginalAssets: false // 不删除源文件
        }))
        config.externals({
          'vue':'Vue',
          // 'vue-router': 'VueRouter',
          'element-ui':'ELEMENT',
          
        })
    },
}