04-封装路由初始化方法

先改造 main.ts

import { createApp } from 'vue'
import App from './App.vue'
import { initRouter } from './router'

const app = createApp(App);
// 初始化路由
initRouter(app);
app.mount('#app')

调整 router 配置文件，不导出 router ，而是导出一个 initRouter 函数的方式去初始化

import {
    createRouter,
    createWebHashHistory,
    type RouteRecordRaw
} from 'vue-router'
import { type App } from 'vue'

const routes: RouteRecordRaw[] = [
    {
        path: '/login',
        name: 'login',
        component: () => import('../views/login/login.vue')
    }
]

const router = createRouter({
    history: createWebHashHistory(),
    routes // 路由配置
})

export const initRouter = (app: App<Element>) => {
    app.use(router)
}