懒加载的三种方法
- 在组件里设置
components: {
viewCom : (resolve) =>{
// ajax或者axios请求后返回执行
// 用定时器模拟一下
setTimeout(()=>{
// viewCom 是要异步加载的组件
resolve(viewCom)
},1000)
}
}
- webpack的代码分割功能
require.ensure([依赖],回调,chunk名字)
依赖是一个数组，没有依赖的话直接写一个空数组
回调
chunk名字：如果想让两甚至更多的模块同一时间加载的话把chunkName设置成一样的就可以打包加载了。
let viewCom = (resolve) => {
return require.ensure([],()=>{
resolve(require('组件路径'))
},"chunkName")
}
components: {
viewCom
}
- import
这种方法没办法把多个模块打包到一起加载
let viewCom = (resolve) => {
return import('组件路径')
}
components: {
viewCom
}