在路由中使用
component:()=>import(/* webpackChunkName:"about" */'../views/About.vue')
來實現組件的懶加載,這種配置會生產一個about.[hash].js
對於優化首屏很有幫助,但對於內部頁面會有一點損失,比較資源不會一次加載到位的
const routes = [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
component: ()=> import(/* webpackChunkName: "about"*/ '../views/About.vue')
}
]
在開發時可以有選擇性地懶加載,全部加載,這個屬於是router級別的代碼分割