为什么要进行路由懒加载
1. 当进行打包构建应用时,打包后的代码逻辑实现包可能会非常大。
2. 当我们把不同的路由对应的组件分别打包,在路由被访问时再进行加载,就会更加高效。
路由懒加载所做的事情
1. 将路由对应的组件加载成一个个对应的js包 。
2. 在路由被访问时才将对应的组件加载。
如何使用路由懒加载呢
routes: [ //未使用 routes:[ //使用
{ {
path: '/imgDetail', path:'/imgDeatail',
name: 'imgDetail', name::'imgDetail',
component: imgDetail component:()=>import('../components/imgDetail')
}, },
] ]
或者依然使用第一种路由的声明方式,但是在函数外部引用:
const imgDetail = ()=> import('./components/imgDetail')
复制代码