路由懒加载

CDN引用项目组件（externals）

屏蔽 SourceMap

......
module.exports = {
  ......

  build: {
    ......

    /**
     * Source Maps
     */
    productionSourceMap: false, // 改为 false
    // https://webpack.js.org/configuration/devtool/#production
    devtool: '#source-map',

    ......
  }
}

GZIP压缩

• cnpm run build之后的.js、.css文件，打包成.js.gz、.css.gz文件

• 安装webpack插件 compression-webpack-plugin

  • npm install --save-dev compression-webpack-plugin@1.1.2
  • 这里推荐使用1.1.2版本，因为高版本的插件在使用时会报ES6语法错误

• 修改 config/index.js

productionGzip: true, // 改为 true
productionGzipExtensions: ['js', 'css'],

• 修改 bulid/webpack.prod.conf.js

if (config.build.productionGzip) {
  const CompressionWebpackPlugin = require('compression-webpack-plugin')

  webpackConfig.plugins.push(
    new CompressionWebpackPlugin({
      // asset: '[path].gz[query]',
      filename: '[path].gz[query]',
      algorithm: 'gzip',
      test: new RegExp(
        '\\.(' +
        config.build.productionGzipExtensions.join('|') +
        ')$'
      ),
      threshold: 10240,
      minRatio: 0.8
    })
  )
}