Vue.js 无法使路由器工作

这是我的路由器/index.js

import Vue from 'vue'
import Router from 'vue-router'
import Home from '../views/Home'
import Login from '../views/Login'

Vue.use(Router)

export default new Router({
  //mode: 'hash',
  routes: [
    {
      path: '/',
      component: Home
    },
    {
      path: '/login',
      component: Login
    },
  ]
})

这是我的登录视图

<template>
  <div class="page">
    <p>
    Login
    </p>
  </div>
</template>

<script>
export default {
  components: { }
}

</script>

我使用

npm run dev

如果我修改主模板，我会看到更改，但路由似乎不适用于/login或其他视图。

在主组件中添加

（

App.vue

）：

---

请阅读：如果您检查我的代码哈希是否被注释掉，您的意思是默认值？没有添加任何模式？

npm run dev

<template>

  <!-- html elements of the App.vue page -->

  <!-- router component -->
  <router-view></router-view>

</template>

export default new Router({
  mode: 'history',
  routes: [
  ...