vue3 工具

CRouter 复杂示例

``javascript
import System from '@/utils/System'
import { createRouter, createWebHashHistory } from 'vue-router'
import CRouter from './CRouter'

/**
* 默认主题
*/
const themeList = ['light', 'dark'] as any[]
const defaultTheme = 'light' as any
const diffTheme = 'dark' as any

/**
* 路由目录/src/views/light/home/index.vue、/src/views/dark/home/index.vue
*/
export const initRouter = () => {
let _modules = import.meta.glob([
'@/views/*/.vue',
'!@/views//-com//.vue',
'!@/views//com//*.vue',
'!@/views//components//*.vue'
])

const _defaultModules = {} as any
const _diffModules = {} as any
Object.keys(_modules).forEach((key) => {
themeList.forEach((item) => {
if (defaultTheme != item) {
if (!new RegExp(^/src/views/${item}).test(key)) {
_defaultModules[key] = _modules[key]
}
if (diffTheme != defaultTheme && new RegExp(^/src/views/${diffTheme}).test(key)) {
_diffModules[key] = _modules[key]
}
}
})
})

const pathHook = (path: string) => {
return path
.replace(/\/index$/, '')
.replace(new RegExp(/${defaultTheme}/), '/')
.replace(new RegExp(/${diffTheme}/), '/')
}

const _routes = CRouter.init({
modules: _defaultModules,
diffModules: _diffModules,

children: [
{
path: '/layout',
component: '/layout',
childrenReg: ['^/pages']
}
],
setInfoHook(item) {
item.meta = {
title: item.path
}
},
mapKeyPathHook(path) {
return pathHook(path)
},
pathHook(path) {
return pathHook(path).replace(/^\/pages/, '')
}
})

const router = createRouter({
history: createWebHashHistory(),
routes: [
..._routes.array,
{
path: '/',
redirect: '/home'
}
]
})

System.router = router

return router
}
``