vue3+ts如何配置路由

• 创建路由实例，createRouter
  配置路由：history or hash；定义路由模式，菜单路由、非菜单路由；定义白名单

import {Router,createRouter} from 'vue-router';
export const router:Router = createRouter({// 定义路由
    // 指定路由模式
    history:getHistoryMode(import.meta.env.VITE_ROUTER_HISTORY),
    // 路由配置
    routes:[{path:'/',name:'Home',component:Home}],
    // 路由切换时的滚动行为
    scrollBehavior(to, from, savedPosition){
        if (savedPosition) { return savedPosition; } else { return { top: 0 };}
    }
})

app.use(router);// 引入路由

• 登录：根据用户角色权限获取动态路由
• 根据router.beforeEach检查用户是否有权限

const whiteList = ['/login'];// 白名单
router.beforeEach((to,form,next) => {
    //判断权限、白名单等
    if(whiteList.indexOf(to.path) != -1){
        next()
    }else{
        next({path:"/login"})
    }
})