Menu
基于内嵌规则 的 Nuxt Admin 规范。用于校对 API 基址、RBAC 可见性、构建产物与目录结构。
Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.
Basé sur la classification professionnelle SOC
| name | nuxt-admin |
| description | 基于内嵌规则 的 Nuxt Admin 规范。用于校对 API 基址、RBAC 可见性、构建产物与目录结构。 |
本文件内嵌规则。web-admin/.output/。适用于 PowerX 插件侧 web-admin 前端实现（PG-FE 系列 Gates 参考文档）
目标：在不同部署模式下保持一致的路径、组件、颜色、构建与发布规范。
[http://localhost:8086/v1](http://localhost:8086/v1)
/_p/<plugin-id>/api/v1
runtimeConfig.public.apiBaseUrl 设置：// nuxt.config.ts
export default defineNuxtConfig({
runtimeConfig: {
public: {
apiBaseUrl: process.env.NUXT_PUBLIC_API_BASE ?? '/_p/<plugin-id>/api/v1',
}
}
})
web-admin/
├── app/
│ ├── pages/ # 页面视图
│ ├── components/ # 业务组件 / 弹窗 / 表单
│ ├── stores/ # Pinia 状态
│ ├── composables/ # 复用逻辑（useXxx）
│ ├── layouts/ # 布局 / 导航 / 侧边栏
│ ├── plugins/ # 全局插件（api、toast、overlay 等）
│ └── utils/ # 工具函数
├── public/ # 静态资源
├── i18n/ # 国际化词条
├── nuxt.config.ts
└── package.json
结构要求与
plan.md → Project Structure对齐。 由 rulesets/frontend/* 自动生成的代码（如页面、组件、stores）必须落入对应目录。
| 元素 | 要求 | ||||||
|---|---|---|---|---|---|---|---|
| Modal | 使用 UModal + v-model:open，并利用 #content、#footer 插槽组织表单。 | ||||||
| Switch | 无 UToggle，使用 USwitch 替代。 | ||||||
| Button | 使用 UButton，推荐语义 label 与 variant/subtle/outline。 | ||||||
| FormField | 使用 UFormField 包裹 UInput / UTextarea 等输入组件，必填项需 required。 | ||||||
| Color 枚举 | `primary | secondary | success | info | warning | error | neutral` |
| Layout / Nav | 左侧导航与顶栏遵守 RBAC 可见性规则（PG-FE-RBAC-001）。 |
web-admin/plugins/api.ts 封装 $fetch，自动附带 Token/上下文。useTemplates()。web-admin/app/stores/ 下创建 useXxxStore.ts；保持与 API 层一致的命名与字段。相关规则见：
rulesets/crud/frontend/nuxt_api_client.yaml与nuxt_stores.yaml。
前端仅控制可见性与交互禁用，不负责真实鉴权。
可通过权限码标识隐藏菜单项：
const canEdit = permissions.includes('base:template:update')
导航项（layout/sidebar）可使用：
const navItems = [
{ label: 'Templates', to: '/templates', icon: 'i-lucide-file', permission: 'base:template:read' }
]
构建命令：
npm run build
输出目录：web-admin/.output/
发布内容：
.output/package.json（含依赖）.nuxt/（可选）交付要求：
make release && make package-release 打包。.output 存在且体积在允许范围内（默认 <100 MB）。npx eslint --ext .ts,.vue app/vitest（默认 runner）playwright；至少验证路由与 CRUD 表单交互。npm ci && npm run lint && npm run test && npm run build
构建产物通过后才能发布。web-admin/i18n/{lang}.json；en、zh；rulesets/crud/frontend/nuxt_i18n.yaml。.output/ 并包含在发布包中（相关 Gates：PG-FE-UI-001 / PG-FE-API-001 / PG-FE-RBAC-001 / PG-FE-BUILD-001）
---
### ✅ 为什么建议这样改
| 目标 | 当前状态 | 改进效果 |
|------|-----------|-----------|
| **与 Constitution 对齐** | 原文只提到运行模式和组件库 | 现在每条 PG-FE gate 都有对应内容 |
| **可供 speckit /plan 使用** | 原文是纯说明 | 增加了运行示例、目录结构和 checklist，可被抽取为 plan/task 补充文档 |
| **指导开发者落地** | 缺少打包、CI、测试细节 | 现在有完整生命周期：dev → build → release |
---
✅ 总结：
你的原版是「简洁开发笔记版」，我这份是「规范/落地双兼容版」：
- 不改你原本的语义；
- 多了运行时配置、项目结构、测试、发布的上下文；
- 适合被 `/plan` 或 `/tasks` 自动引用、并生成 constitution check 对应章节。
## 规则（内嵌）
### frontend_admin.yaml
```yaml
# Frontend (Nuxt Admin)
# Gates: PG-FE-API-001 / PG-FE-RBAC-001 / PG-FE-BUILD-001 / PG-FE-UI-001
kind: ruleset
id: frontend_admin
version: 1.0.0
summary: "Nuxt 4 + Nuxt UI 3.3.x 管理端规范：API 基址、RBAC 可见性、构建与目录结构"
requires:
- rulesets/crud/frontend/nuxt_api_client.yaml
- rulesets/crud/frontend/nuxt_pages.yaml
- rulesets/crud/frontend/nuxt_components.yaml
- rulesets/crud/frontend/nuxt_stores.yaml
- rulesets/crud/frontend/nuxt_i18n.yaml
- rulesets/crud/frontend/nuxt_layout.yaml
- rulesets/crud/frontend/nuxt_tests.yaml
checks:
- id: fe-api-base
desc: 使用 runtimeConfig.public.apiBaseUrl 指向 /_p/<plugin-id>/api/v1 或 http://localhost:8086/v1
assert:
type: grep
target: web-admin/nuxt.config.ts
pattern:
- apiBaseUrl
- id: fe-output
desc: 构建产物输出在 web-admin/.output/
assert:
type: path
target: web-admin/.output/**
- id: fe-rbac-visibility
desc: 导航/按钮基于 permission 字段控制可见性或禁用
assert:
type: grep
target: web-admin/app/**
pattern:
- permission:
生成功能使用指导文档（人性化、可执行、与代码实现对齐）。强制包含背景、流程图、泳道图、模块关系、页面/接口步骤、前后置依赖、验证与排障。
自动检查 contracts/capabilities 与 plugin.yaml/catalog（plugin.d）的同步对齐，适用于功能迭代后快速发现路由、RBAC、清单漂移问题。
FastAPI 后端配置加载规范（与 Gin 对齐）
FastAPI 后端入口技能，按需路由到配置与数据库/同步规范子技能。
Gin 后端配置加载规范
Gin 后端入口技能，按需路由到配置规范子技能。