处理本地导出的 Axure 原型资源并生成主题、数据模型与页面还原的流程规范;在需要基于 sitemap.json 与本地页面资源进行分析与还原时使用。
处理本地导出的 Axure 原型资源,包括主题提取、数据模型识别和页面还原。
<project-dir>/
├── sitemap.json # 站点地图
└── page-<index>-<name>/ # 页面目录
├── assets/
│ ├── images/ # 图片资源
│ └── fonts/ # 字体资源(如有)
├── theme.json # 设计令牌(Top10)
├── content.md # 页面内容(Markdown)
└── screenshot.png # 页面截图
用户未提供目录路径时,使用 listDirectory 工具查找 temp/ 下的项目目录(通常在二级目录下包含 sitemap.json)。找到后读取 sitemap.json 获取项目名称,询问用户是否处理该项目;如不是则请求提供正确路径。
验证目录结构(检查 sitemap.json),解析站点地图,明确用户需求(默认:提取主题、识别数据、生成文档)。
选择 3-5 个核心页面(首页、登录页、主要功能页),读取各页面的 theme.json 并结合 screenshot.png 分析视觉风格,合并主题数据(颜色、字体、间距、圆角、阴影),总结设计语言并生成设计规范。
输出:src/themes/<theme-key>/(包含 globals.css 或 designToken.json(designToken.json 必须包含 name 字段)、DESIGN.md、index.tsx,符合 theme-guide.md 规范)
识别数据密集型页面(列表页、表单页、详情页),读取 content.md 提取文本内容,从表格列名、表单标签、重复模式中识别数据结构,跨页面验证并合并字段。
输出:src/database/<table-name>.json
users.json)tableName 使用中文(如 "用户表")数据表结构(强约束):每个文件必须是 JSON 对象(不要输出为纯数组),包含 tableName + records。
{
"tableName": "表名(中文)",
"records": [
{ "id": 1, "字段1": "值1", "字段2": "值2" }
]
}
最小一致性规则(用于减少错误):
records 必须是数组;每条记录必须包含唯一的 id(允许 number 或 string,同表保持类型一致)。images/xxx.png),不要 base64。生成站点地图文档(保持层级结构,页面名称可点击)和项目简介文档(基本信息、设计风格、数据模型概览)。
输出:src/docs/
选择还原页面(用户指定或从站点地图选择 1-2 个核心页面)。
核心方法:看图 → 写代码 → 交付。
确认前置条件
获取截图
screenshot.pngsitemap.json 含 projectUrl,可使用 MCP 获取在线截图(仅在本地不足时)验证图片读取能力
screenshot.png[图片绝对路径] 复制到对话框后提交"生成页面代码
辅助数据获取(可选,生成仍以图片为主):
主题:theme.json(校验样式)
文本:content.md(校验文案)
直接基于截图生成页面代码
在代码生成过程中内部完成:
输出文件:
src/prototypes/<page-name>/index.tsxsrc/prototypes/<page-name>/style.css(必须包含 @import "tailwindcss";)src/prototypes/<page-name>/components/(根据需要)核心代码规范(必须遵守):
Component,使用 export default Componentrules/development-guide.md验收页面还原
node scripts/check-app-ready.mjs /prototypes/[页面名]生成规格文档
src/prototypes/<page-name>/spec.md最终交付
theme.json 的 design tokens。content.md 校准文案(不影响布局与交互)。doms.toon。输出:符合 rules/development-guide.md 规范的页面组件
sitemap.json 包含 projectUrl 时,可使用本项目MCP 工具获取在线资源(本地资源优先,仅在不足或需要最新数据时使用)。
⚠️ 未找到有效的 Axure 资源目录。
请确认目录包含 sitemap.json 和页面目录。
✓ 已识别资源目录,共 [X] 个页面。
默认方案:
- 从核心页面提取设计主题并生成设计规范文档
- 识别数据模型
- 生成项目文档
回复"接受"按默认方案执行,或告诉我您的具体需求。
正在处理...
✓ 已解析站点地图
✓ 已提取主题数据
⏳ 正在分析数据模型...
✅ 已完成!
生成的资产:
- 设计主题:src/themes/<theme-key>/
- 设计规范文档:src/themes/<theme-key>/DESIGN.md
- 数据模型:src/database/
- 项目文档:src/docs/
后续建议:
💡 我还可以为您:
- 还原页面:告诉我需要还原的页面名称
- 生成业务文档:领域模型、业务流程等
需要吗?
theme-guide.md | development-guide.md