component: resolve => require(['../pages/home.vue'], resolve)-裝載

import Vue from 'vue'
import VueRouter from 'vue-router'
// "@"至關於".."
import Detail from '../pages/goodsDetail'
import Msg from '../components/message.vue'

// 使用路由
Vue.use(VueRouter)

export default new VueRouter({
mode: 'history',
routes: [
{
// 進行路由配置,規定'/'引入到home組件
path: '/',
component: resolve => require(['../pages/home.vue'], resolve),
meta: {
title: 'home'
}
},
{
path: '/msg',
component: Msg
},
{
path: '/detail',
component: Detail,
children: [
{
path: 'msg',
component: Msg
}
]
}
]

 

component: resolve => require(['../pages/home.vue'], resolve),

 

若是用import引入的話，當項目打包時路由裏的全部component都會打包在一個js中，形成進入首頁時，須要加載的內容過多，時間相對比較長。
當你用require這種方式引入的時候，會將你的component分別打包成不一樣的js，加載的時候也是按需加載，只用訪問這個路由網址時纔會加載這個js。
你能夠打包的時候看看目錄結構就明白了。