Oiyo 采用基于文件系统的路由机制，让每一个接受配置的目录（主、分包）都接受路由器自动扫描注册。
Oiyo 路由是基于 pages.json 规范，通过扫描 主包 与 分包 目录中每一个符合条件的 vue 文件来生成注册对应的路由。
pages
├── home.vue
└── order
└── list.vue
{
"pages": [
{
"path": "pages/home",
"type": "page"
},
{
"path": "pages/order/list",
"type": "page"
}
]
}
主包是存放应用核心页面的包，默认的主包页面目录位于 src/pages 中。
对于主包中另一个关键核心就是 TabBar 了，我们需要通过 src/pages.config.ts 来配置。
pages
├── home
│ └── index.vue
└── order
└── index.vue
import { definePageConfig } from '@skiyee/oiyo/config'
export default definePageConfig({
tabBar: {
list: [
{
pagePath: 'pages/home/index',
text: '首页',
},
{
pagePath: 'pages/order/index',
text: '订单',
}
],
},
})
{
"pages": [
{ "path": "pages/home/index" },
{ "path": "pages/order/index" }
],
"tabBar": {
"list": [
{
"pagePath": "pages/home/index",
"text": "首页",
},
{
"pagePath": "pages/order/index",
"text": "订单",
}
],
},
}
默认不配置子包路径，因为子包目录具有主观型。我们需要通过 oiyo.config.ts 来配置。
.
├── sub-direct
│ └── order
│ └── list.vue
└── sub-nested
└── order
└── pages
└── detail.vue
import { defineOiyoConfig } from '@skiyee/oiyo/config'
export default defineOiyoConfig({
dir: {
subPackages: ['sub-direct', 'sub-nested/order'],
},
})
{
"subPackages": [
{
"root": "sub-direct",
"pages": [
{
"path": "order/list",
"type": "page"
}
]
},
{
"root": "sub-nested/order",
"pages": [
{
"path": "pages/detail",
"type": "page"
}
]
}
]
}