路由
路由配置概述
项目使用Nuxt.js 3的路由系统,基于Vue Router构建。
主路由配置 (app/pages/routes.ts)
主路由配置文件定义了项目的核心路由结构,采用数组方式组织,每个路由项包含路径、组件和元信息。
typescript
export default [
{
path: "/",
component: () => import('~/app/pages/index.vue')
},
{
path: "/auth/login",
component: () => import('~/app/pages/auth/login.vue'),
meta: {
layout: "container"
}
},
{
path: "/member",
component: () => import('~/app/pages/member/index.vue'),
meta: {
middleware: ["auth"]
}
},
// 其他路由...
]路由选项配置 (app/router.options.ts)
路由选项配置文件扩展了基础路由系统,支持插件路由的动态加载和路由行为配置。
typescript
import type { RouterConfig } from '@nuxt/schema'
import routes from '@/app/pages/routes'
const addonRoutes = import.meta.globEager('@/addon/**/pages/routes.ts')
for (const key in addonRoutes) {
const addon = key.split('/')[2]
routes.push(...addonRoutes[key].default.map((item) => {
item.meta = item.meta ? Object.assign(item.meta, { addon }) : { addon }
return item
}))
}
// https://router.vuejs.org/api/interfaces/routeroptions.html
export default <RouterConfig>{
routes: (_routes) => routes,
strict: false
}