需求背景
项目加载过慢,用户进入首页等高频页面需要等待较长时间。
问题分析
vue项目打完包后将所有页面生产一个app.js,这个文件下载完成之后页面才开始渲染。如果页面较多,打包生产的app.js太大,则加载时间长。
解决方案
将非高频组件拆分开来,打包时生成对应的js文件,并在进入某个页面时按需加载。
具体实现
大佬代码说明
- const申明的路由文件即为被拆分出去的需要异步加载的组件。
- ES6的箭头函数简写语法不需要多说了吧,自己看。
- 你需要了解require.ensure()的用法和语法,这里有一篇文章值得一看。
网友评论