此檔案位置：myproject/src/router/index.js

// 0.如果使用模組化機制程式設計，匯入Vue和VueRouter
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
// 1. 定義（路由）元件
const HelloWorld = { template: '<p>hello vue菜鳥教程</p>' }
const aa = { template: '<p>vue菜鳥教程aaaa</p>' }
// 2. 定義路由
// 每個路由應該對映一個元件。
// http://localhost:8080/#/a/
 

// http://localhost:8080/#/hello/
// 瀏覽器訪問路徑中的#是因為在入口js檔案中，如果你不更改設定的話
// vue會預設使用hash模式，該模式下回將路徑格式化為 # 開頭。
// 在建立的router物件中，如果不配置mode，就會使用預設的hash模式
// 該模式下將路徑格式化為#！開頭
// 新增mode後，瀏覽器訪問
// http://localhost:8080/a
// http://localhost:8080/hello
const routes = [
  { path: '/hello', component: HelloWorld },
  { path: '/a', component: aa }
]

// 3. 建立 router 例項，然後傳 `routes` 配置
 

export default new Router({
  mode: 'history',
  routes: routes
})

// 4. 在App.vue中router-view建立和掛載根例項
/*
<template>
  <div id="app">
    <img src="./assets/logo.png">
    <!-- 4. router-view建立和掛載根例項-->
    <router-view/>
  </div>
</template>
*/