懶加載也叫延遲加載,即在須要的時候進行加載,隨用隨載vue
在單頁應用中,若是沒有應用懶加載,運用webpack打包後的文件將會異常的大,
形成進入首頁時,須要加載的內容過多,延時過長,不利於用戶體驗,
運用懶加載能夠將頁面進行劃分,按需加載頁面,能夠分擔首頁所承擔的加載壓力,減小加載用時。webpack
一種代碼分塊的語法,使用 AMD 風格的 requireweb
import Vue from 'vue' import Router from 'vue-router' //內容區域 //import Main from '@/components/common/main' //個人店鋪-店鋪首頁 //import Home from '@/components/page/home/home' //商品管理-商品發佈 //import Issue from '@/components/page/product/product_issue' Vue.use(Router) // export default new Router({ // routes: [ // { // path: '/', // name: 'main', // component: Main, // children:[ // { // path: '/home', // component: Home // },{ // path: '/issue', // component: Issue // } // ] // } // ] // }) const routes = [ { path:'/', component:resolve => require(['@/components/common/main'],resolve), children:[ { path:'/home', component:resolve => require(['@/components/page/home/home'],resolve) }, { path:'/issue', component:resolve => require(['@/components/page/product/product_issue'],resolve) } ] } ] const router = new Router({ routes }) export default router;