SuperAPI AI 工具集

peach-gen-ui

前端与建站

查看项目

更新于 10-15 23:24

技能介绍

用途:根据已有 Store 生成生产级前端 UI,面向 Vue 3 + TypeScript + NuxtUI v4 项目,触发关键词包括“UI 만들어줘”“화면 생성”“CRUD 화면”“목록 화면”。前提是 Store 已存在(Mock 数据或已连接 API),无 Store 时先生成 Mock 基础 Store。

主要能力:提供 crud、page、two-depth、infinite-scroll、select-list、show-more、batch-process 等基础 UI 模式,以及 adv-search、calendar、kanban、mega-form、tab-list 等高级模式;支持 excel、file 选项。生成 pages、modals、路由与 Yup 校验等文件结构,组件使用 kebab-case(如 <u-button>、<u-modal>)。存在 _common/components 时优先使用其包装组件,否则直接使用 NuxtUI。

使用方式:命令为 /peach-gen-ui [모듈명] [옵션],如 /peach-gen-ui notice-board、/peach-gen-ui member-manage excel=Y。运行时以对话方式选择 UI 模式,随后进行 Store 确认、领域分析、代码生成与验证。验证命令为 cd front && bunx vue-tsc --noEmit、cd front && bun run lint:fix、cd front && bun run build,三者通过才算完成。

视觉与限制:需遵循项目主题(Primary #287dff、Pretendard 字体),优先 NuxtUI 组件并最小化自定义样式;禁止渐变、过度阴影、无意义动画、hover 放大、过大圆角等“AI Slop”模式。必须遵守 listAction、resetAction、listMovePage、watch 等必用模式。适用于后台管理与 CRUD 页面生成,生成代码需通过类型检查、lint 与构建,具体收费、价格、效果等暂未提供。