Vue3.2+Vite2.x+Typescript项目进阶搭建-

安装依赖

npm i vue-router --save -dev

src下创建目录router，router目录下创建文件index.ts,文件内容如下

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

//配置路由和组件之间的映射
const routes = [
    {
        path: '/',
        //Login.vue 不可以省略.vue后缀
        component: () => import("/@views/Login.vue")
    }
];
const index = createRouter({
    history: createWebHistory(),
    routes
});

export default index;

可以通过扩展 RouteMeta 接口来输入 meta 字段：

// typings.d.ts or router.ts
import 'vue-router'

declare module 'vue-router' {
  interface RouteMeta {
    // 是可选的
    isAdmin?: boolean
    // 每个路由都必须声明
    requiresAuth: boolean
  }
}

main.js

import App from './App.vue'
import router from './router';

const app = createApp(App);

app.use(router);
app.mount('#app')

最基本的配置就完成了