路由懒加载

 

推荐使用下面的方法

import Vue from 'vue'
import VueRouter from 'vue-router'

const Home = () => import('../components/Home')
const About = () => import('../components/About')
const User = () => import('../components/User')

//1.通过Vue.use(插件)，安装插件
Vue.use(VueRouter)

//2.创建VueRouter对象
const routes = [
    {
     path:'/',
     //重定向到home
     redirect: '/home'
    },
    {
     path:'/home',
     component: Home
    },
    {
        path:'/about',
        component: About    
    },
    {
        path: '/user/:userName',
        component: User
    }
]

const router = new VueRouter({
    mode: 'history',//使用history模式，去除url中的#符号（hash模式）
    //配置路由和组件之间的应用关系
    routes
})

//3.将router对象传入到vue实例
export default router