懶載入：也叫延遲載入，即在需要的時候進行載入，隨用隨載。

使用懶載入的原因： vue是單頁面應用，使用webpcak打包後的檔案很大，會使進入首頁時，載入的資源過多，頁面會出現白屏的情況，不利於使用者體驗。運用懶載入後，就可以按需載入頁面，提高使用者體驗。

整個網頁預設是剛開啟就去載入所有頁面，路由懶載入就是隻載入你當前點選的那個模組。

按需去載入路由對應的資源，提高首屏載入速度（tip:首頁不用設定懶載入，而且一個頁面載入過後再次訪問不會重複載入）。

實現原理：將路由相關的元件，不再直接匯入了，而是改寫成非同步元件的寫法，只有當函式被呼叫的時候，才去載入對應的元件內容。

import Vue from 'vue'
import Router from 
 
'vue-router'
Vue.use(Router)
export default new Router({
  mode: 'history',
  routes: [
   {
      path: '/',
      component: resolve => require(['@/components/DefaultIndex'],resolve),
      children: [
        {
          path: '',
          component: resolve => require(['@/components/Index'],resolve)
        },
        {
          path: 
 
'*',
          redirect: '/Index'
        }
      ]
})

傳統路由配置

import Vue from 'vue'
import Router from 'vue-router'
import DefaultIndex from '@/components/DefaultIndex'
import Index from '@/components/Index'
Vue.use(Router)
export default new Router({
  mode: 'history',
  routes: [
   {
      path: '/',
      component: 
 
'DefaultIndex ',
      children: [
        {
          path: '',
          component: 'Index'
        },
        {
          path: '*',
          redirect: '/Index'
        }
      ]
})