1.路由懒加载 大项目中的路由懒加载不适用于开发环境(会导致保存代码时热更新代码时间很长20s左右),我们需要配置不同环境下的路由配置,目录如下

在 router/ 文件夹中加入2个文件夹:
_import_development.js
module.exports = file => require('@/' + file + '.vue').default
_import_production.js
module.exports = file => resolve => require(['@/' + file + '.vue'], resolve)
index.js
const IMPORT = require('./_import_' + process.env.NODE_ENV + '.js');
组件引入时写入:
component: IMPORT('pages/mainPage') // 组件
这样在开发环境时编译代码时间会大大加快,在生产环境也会使用到懒加载的路由,减小首屏加载的体积,看下效果


18.7s → 4.35s 大概优化了76%的时间。