Vue 基础-简单实现页面调用及配置

第一种根目录下：

修改router文件夹下index.js

• component名称 对应导包时的improt后的名称

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import Index from '@/components/index'

Vue.use(Router);

let router = new Router({
  mode:'history', //去掉页面路径#美化
  routes: [
    { path: '/',name: 'HelloWorld',component: HelloWorld},
    {path: '/index',name: 'index',component: Index},
  ]
});


export default router

第二种2级以上目录：

import Vue from 'vue'
import Router from 'vue-router'
import Test from '../components/gb/test.vue'  //后缀可省略
Vue.use(Router);

let router = new Router({
  mode:'history', //去掉页面路径#美化
  routes: [
    {path: '/gb/test',name: 'test',component: Test},

  ]
});


export default router

注意：如果修改以下，路径会找不到