路由设置失败

# 具体遇到的问题
路由设置失败
# 报错信息的截图

访问http://localhost:8080/

访问http://localhost:8080/login/

# 相关课程内容截图

# 尝试过的解决思路和结果

# 粘贴全部相关代码，切记添加代码注释（请勿截图）

// App.vue

<template>

<router-view />

</template>

<script>

export default {

name: 'App'

}

</script>

// router/index.js

import { createRouter, createWebHashHistory } from 'vue-router'

import { Home } from '../views/home/Home'

import { Login } from '../views/login/Login'

const routes = [

{

path: '/',

name: 'Home',

component: Home

}, {

path: '/login',

name: 'Login',

component: Login

}

// {

//   path: '/about',

//   name: 'About',

//   // route level code-splitting

//   // this generates a separate chunk (about.[hash].js) for this route

//   // which is lazy-loaded when the route is visited.

//   component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')

// }

]

const router = createRouter({

history: createWebHashHistory(),

routes

})

export default router

// views/home/Home.vue

...

<script>

import StaticPart from './StaticPart'

import Nearby from './Nearby'

import Docker from './Docker'

export default {

name: 'Home',

components: { StaticPart, Nearby, Docker }

}

</script>

...

// views/login/Login.vue

​...

<script>

export default {

name: 'Login'

}

</script>

...