vite + Vue3 搭建路由

1.下载路由包

npm install vue-router@4

2.在src创建路由文件

index.js文件

// 引入 router
import { createRouter, createWebHistory } from 'vue-router'
// 引入路由各页面配置
import routes from './routes'
// 配置router对象
const router = createRouter({
    history: createWebHistory(),
    routes
})
export default router

routes文件

const routes = [
    {
        path: '/',
        name: 'index',
        title: '登录',
        component: () => import('../views/Login/login.vue'), //.vue不能省略
    }
]
export  default routes

3.在main.js 添加路由

import { createApp } from 'vue'
import App from './App.vue'
import router from "./router";
const app = createApp(App);
app.use(router);
app.mount('#app')