vue3项目手动安装路由

1.npm install vue-router@4.3.3
2.在src文件夹下创建router文件夹，在router文件夹下创建index.js
import { createRouter, createWebHistory } from 'vue-router'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
        path: '/',
        redirect: '/home'
    },
    {
      path: '/home',
      name: 'home',
      component: () => import('../views/HomeView.vue')
    },
    {
      path: '/about',
      name: 'about',
      component: () => import('../views/AboutView.vue')
    }
  ]
})

export default router

3.在src文件夹下创建views文件夹，在views文件夹下创建home,.vue,about.vue,文件

4.在app.vue中修改这一部分
<template>
  <div class="nav-btn">
    <router-link to='/'> Home</router-link>
    <router-link to='/about'>About </router-link>
  </div>
  <router-view></router-view>
</template>

5.最后在全局 main.js 引入一下 router。
import { createApp } from 'vue'
import App from './App.vue'
import './style.css'
import router from './router'

const app = createApp(App)
app.use(router)
app.mount('#app')
然后这个就可以了！