mirror of
https://github.com/ialley-workshop-open/uni-halo.git
synced 2026-09-13 00:50:40 +08:00
小莫唐尼
49 lines
1.6 KiB
Markdown
49 lines
1.6 KiB
Markdown
# 新页面 / 新组件 SOP
|
|
|
|
## 1. 新建页面(3 步)
|
|
|
|
1. **建文件**:`src/pages/模块名/页面名.vue`(约定式路由,文件路径即路由,**无需注册**)
|
|
2. **写 `definePage` 宏,放在 script 最上面**:
|
|
|
|
```vue
|
|
<script setup lang="ts">
|
|
definePage({
|
|
style: { navigationBarTitleText: '页面标题' },
|
|
})
|
|
</script>
|
|
```
|
|
|
|
3. **跑 `pnpm type-check`**:重新生成 `src/types/uni-pages.d.ts`,路由类型才可用
|
|
|
|
注意:
|
|
- 页面私有组件放同目录 `components/` 子目录(构建时已排除,**不会被识别成页面**)
|
|
- 需要登录态的页面按项目现有登录拦截方式处理,不自行在页面内写 token 判断
|
|
|
|
## 2. 新建全局组件(1 步)
|
|
|
|
放 `src/components/fg-组件名/fg-组件名.vue`,easycom 规则 `^fg-(.*)` 自动注册,任何页面直接 `<fg-组件名 />`,**无需 import**。
|
|
|
|
- z-paging 同理:`<z-paging>` 直接用
|
|
- 其他第三方库组件按各自 easycom 规则
|
|
|
|
## 3. 新建分包页面(2 步)
|
|
|
|
1. 分包目录放 `src/pages/` **之外**(如 `src/pages-sub/xxx`),内建页面文件
|
|
2. 在 `vite.config.ts` 的 `UniPages({ subPackages: [...] })` 数组加目录路径
|
|
|
|
## 4. 新增 tabbar 项(1 步)
|
|
|
|
只改 `src/tabbar/config.ts`(唯一配置源),pages.json 的 tabBar 段自动生成。图标等资源同步放约定目录。
|
|
|
|
## 5. 新增组合式函数(1 步)
|
|
|
|
放 `src/hooks/`,auto-import 已配置 `dirs: ['src/hooks']`,页面内**直接调用,无需 import**。
|
|
|
|
## 6. 验证清单(新建任何东西后)
|
|
|
|
```bash
|
|
pnpm type-check # 路由/组件类型生成且零错误
|
|
pnpm lint # 格式合规
|
|
pnpm dev:mp # 目标平台真机/模拟器跑一遍
|
|
```
|