vue3 单独安装路由 vue-router 记录下主要步骤

官方文档地址：https://router.vuejs.org/zh/guide/

1. 安装vue-router

npm install vue-router

2. 路由信息文件 /src/router/index.js

import { createMemoryHistory, createRouter } from 'vue-router'
#定义好相关的页面
import Home from '../page/Home.vue'
import Discover from '../page/Discover.vue'
import Cate from '../page/Cate.vue'
import Me  from '../page/Me.vue'

const routes = [
    { path: '/', component: Home },
    { path: '/Cate', component: Cate },
    { path: '/Discover', component: Discover },
    { path: '/Me', component: Me },
]

const router = createRouter({
    history: createMemoryHistory(),
    routes,
})
export default  router

3. 在main.js中引入

import './assets/main.css'

import { createApp } from 'vue'
import { createPinia } from 'pinia'
import router from './router' // 第一步
import App from './App.vue'

const app = createApp(App)

app.use(createPinia())
app.use(router)  // 第二步

app.mount('#app')

路径展示