路由懶載入

兩種方式： 1..Vue非同步載入技術

    1：vue-router配置路由，使用vue的非同步元件技術，可以實現懶載入，此時一個元件會生成一個js檔案。
    2：component: resolve => require(['放入需要載入的路由地址'], resolve)
​

  {
      path: '/problem',
      name: 'problem',
      component: resolve => require(['../pages/home/problemList'], resolve)
    }
​

2.ES6推薦方式imprort ()

    1：直接將元件引入的方式，import是ES6的一個語法標準，如果需要瀏覽器相容，需要轉化成es5的語法。
    2：推薦使用這種方式，但是注意wepack的版本>2.4
    3：vue官方文件中使用的也是import實現路由懶載入
    4：上面宣告匯入，下面直接使用
​
 

import Vue from 'vue';
import Router from 'vue-router';
// 官網可知：下面沒有指定webpackChunkName，每個元件打包成一個js檔案。
const Foo = () => import('../components/Foo')
const Aoo = () => import('../components/Aoo')
// 下面2行程式碼，指定了相同的webpackChunkName，會合並打包成一個js檔案。
// const Foo = () => import(/* webpackChunkName: 'ImportFuncDemo' */ '../components/Foo')
 

// const Aoo = () => import(/* webpackChunkName: 'ImportFuncDemo' */ '../components/Aoo')
export default new Router({
    routes: [
        {
            path: '/Foo',
            name: 'Foo',
            component: Foo
        },
        {
            path: '/Aoo',
            name: 'Aoo',
            component: Aoo
        }
    ]
})