路由基本创建

一级路由创建

1.在views文件夹中创建对应的路由页面组件

2.配置路由 在router下index.js中进行配置

（2-1）先把你要使用的组件页面引用

（2-2）配置路由规则

import Vue from 'vue'
import VueRouter from 'vue-router'
// 1.把你要使用的路由页面引用
import Fenlei from '../views/fenlei.vue'
import Gouwuche from '../views/gouwuche.vue'
import Home from '../views/home.vue'
import Jingxi from '../views/jingxi.vue'
import Wode from '../views/wode.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',//url路径
    name: 'home',//给这个路由规则起个名字
    component: HomeView //引用组件
  },

 // 下面是后面要学的
  // {
  //   path: '/about',
  //   name: 'about',
  //   component: () => import('../views/AboutView.vue')
  // }]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router

3.在app.vue中设置router-view路由出口