vue项目webpack编译速度优化

对于路由多的vue项目，编译时时间会很长
1.安装webpack插件hard-source-webpack-plugin，对模块编译进行缓存
npm install hard-source-webpack-plugin --save-dev
第一次构建时是进行缓存，第二次编译会感觉速度会有很大提升
在vue.config.js中判断是否为开发环境，然后在plugins添加

const HardSourceWebpackPlugin = require('hard-source-webpack-plugin') //引入插件
if (process.env.NODE_ENV === 'development') {
  vueConfig.configureWebpack.plugins.push(new HardSourceWebpackPlugin({
    // cacheDirectory是在高速缓存写入 ，设置缓存在磁盘中存放的路径
    cacheDirectory: '../../remarks/.cache/hard-source/[confighash]' // 要放缓存的路径
  }))
}

如果感觉还是慢，继续下一步
2.安装webpack插件
npm install babel-plugin-dynamic-import-webpack --save-dev
在babel.config.js中使用

const plugins = []
if (process.env.NODE_ENV === 'development') {
    // 判断是否为生产环境
  plugins.push('dynamic-import-node', '@babel/plugin-syntax-dynamic-import')
}
module.exports = {
  presets: [],
  plugins
}