vue组件异步加载

需求背景

项目加载过慢，用户进入首页等高频页面需要等待较长时间。

问题分析

vue项目打完包后将所有页面生产一个app.js，这个文件下载完成之后页面才开始渲染。如果页面较多，打包生产的app.js太大，则加载时间长。

解决方案

将非高频组件拆分开来，打包时生成对应的js文件，并在进入某个页面时按需加载。

具体实现

大佬代码

说明

• const申明的路由文件即为被拆分出去的需要异步加载的组件。
• ES6的箭头函数简写语法不需要多说了吧，自己看。
• 你需要了解require.ensure()的用法和语法，这里有一篇文章值得一看。