SuperAPI AI 工具集
合作ENAI 行业资讯收藏
Skill 广场glmv-prd-to-app

glmv-prd-to-app

编程与开发

查看项目

更新于 10-16 02:24

技能介绍

用途

GLM-V PRD-to-App 用于从产品需求文档（PRD）、UI 原型图片和资源文件构建完整、可部署的全栈 Web 应用。其目标产物必须能通过单个 bash /workspace/start.sh 完全复现。

主要能力

该技能按阶段推进完整流水线：

  • 阶段 0：材料发现与分析。定位 /workspace/prd.md、/workspace/prototypes/.jpg、/workspace/resources/**/ 等输入；逐张读取原型图片，记录页面身份、布局结构、组件清单、内容清单、颜色（十六进制）、字体层级、交互状态、数据模式，并构建页面导航图；同时盘点资源文件并映射到原型中的出现位置。
  • 阶段 1：系统设计文档。产出 /workspace/docs/design.md，包含数据模型（表名、字段类型、约束、默认值、关系、索引、内容映射）、API 设计（方法、路径、请求/响应模式、触发交互、错误响应）、前端架构（组件树、路由、状态管理）、技术栈选择与理由、目录结构。
  • 阶段 2：种子数据生成。要求从原型中提取所有可见文本、图片、数字，覆盖列表/表格/卡片/下拉/导航/统计数字，使用资源文件，禁止占位内容，并支持空状态、加载状态、错误场景。
  • 阶段 3：后端实现。创建迁移文件、实现 API 端点（含输入校验与错误处理）、编写种子脚本、配置静态文件服务。
  • 阶段 4：前端实现。建立全局样式与设计令牌，逐页实现并匹配原型布局、颜色、字体、层级与内容位置，接入 API，实现导航、表单、搜索、筛选、排序、弹窗、加载/错误状态、悬停与选中状态等交互，并集成资源文件。
  • 阶段 5：视觉验证循环。使用 Playwright 渲染页面截图，与原型并排比较布局、颜色、字体、内容、间距、图片、组件，修复差异，每页最多迭代 3 次。
  • 阶段 6：集成测试。运行 API 健康检查、端到端流程验证，修复 CORS、API URL 不匹配、数据格式不匹配等问题。
  • 阶段 7：部署脚本。生成 /workspace/start.sh，要求自包含、可在全新环境运行、安装系统依赖、清理旧状态、从零建立数据库、运行迁移、加载种子数据、构建前端、启动前后端，使应用在 http://localhost:3000 可用。
  • 阶段 8：文档。更新设计文档，编写 README（概述、技术栈、快速开始、项目结构、数据库、API 参考）。

使用方式

技能以工作区目录结构为约定：/workspace/prd.md、/workspace/prototypes/、/workspace/resources/、/workspace/frontend/、/workspace/backend/、/workspace/docs/、/workspace/start.sh。若材料位于其他位置需相应调整。技能内提供了渲染页面脚本与 API 检查脚本的调用示例：

python ${SKILL_DIR}/scripts/render_page.py \
  --url "http://localhost:3000/page-path" \
  --output "/workspace/docs/screenshots/page_name.png" \
  --width 1280

python ${SKILL_DIR}/scripts/check_api.py \
  --base-url "http://localhost:3000/api" \
  --endpoints-file "/workspace/docs/endpoints.json"

部署脚本模板包含系统依赖检查、后端安装、数据库初始化、前端安装、资源复制、启动后端、启动前端等步骤，最终输出应用地址与进程 PID。

适用场景

适用于需要从 PRD 与原型快速生成可运行全栈应用的场景，尤其是要求视觉还原度高、数据来自数据库而非硬编码、且需要一键复现部署的项目。

限制与原则

  • 原型是视觉/布局决策的最终依据，当 PRD 文本与原型图片冲突时以原型为准。
  • 数据不得走捷径：原型中可见的每项内容都必须来自数据库经 API 提供，前端组件不得硬编码数据。
  • 必须完整实现每个页面、功能与交互，不得跳过“次要”功能，不得合并独立页面。
  • 资源必须使用：若原型显示某图片且 /workspace/resources/ 中存在匹配文件，必须使用该文件，不得用占位 URL 替代。
  • 可复现性：start.sh 必须能从绝对零状态运行，需要 Node 18+ 则安装，需要 PostgreSQL 则配置。
  • 必须验证而非假设：通过视觉验证循环、API 检查与运行 start.sh 来确认结果。
  • 语言方面：使用与用户相同的语言回应，代码注释保持一致。

关于收费、价格、平台支持范围等具体信息，资料中暂未提供。