路由懒加载

路由懒加载

打包的时候所有文件不会打包到同一个js中，提高加载效率

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

// 路由懒加载
const Home = ()=> import('@/components/Home')
const About = ()=> import('@/components/About')
const User = ()=> import('@/components/User')
// 导入路由对象
Vue.use(Router)
// 创建VueRouter对象
const routes = [
  {
    // 默认值
    path:'',
    redirect:'/home'
  },
  {
    path:'/home',
    component:Home
  },
  {
    path:'/about',
    component:About
  },
  {
    path:'/user/:userId',
    component:User
  }
]
// 创建路由和组件之间的映射关系
const router = new VueRouter({
  routes,
  mode:'history', // 默认是hash模式
  linkActiveClass:'active' // 激活样式
});

export default router