SuperAPI AI 工具集

export-handoff

编程与开发

查看项目

更新于 10-15 20:09

技能介绍

用途:导出设计成果并生成面向开发者的交接文档,帮助把原型转换为生产代码。

主要能力:export-html 将所有设计文件打包为单个独立 HTML(含 Tailwind CSS 和 Alpine.js CDN),返回 html、filename、filePath、fileCount;export-zip 生成按类型组织的 ZIP 及元数据,返回 zipBase64、filename、filePath、fileCount;export-pdf 返回供浏览器端渲染 PDF 的设计数据;export-svg 以 foreignObject 包裹独立 HTML 导出 SVG(不可作为可编辑矢量导入 Figma);export-design-as-figma-svg 导出真正矢量 SVG,Figma 可解析为可编辑图层,可选 nodeId、embedImages,返回 svg、filename、report、filePath;export-coding-handoff 返回可被外部编码智能体获取的 token 化 raw 与 ZIP URL 及可复制提示词,支持 format、origin;deploy-design-preview 触发预览部署,需 fusion tier 与 Builder.io 连接及已存在分支,仅预览不发布生产。

使用方式:通过 pnpm action 调用,例如 pnpm action export-html --id <designId>、pnpm action export-zip --id <designId>、pnpm action export-pdf --id <designId>、pnpm action export-design-as-figma-svg --designId <designId>、pnpm action export-coding-handoff --id <designId>、pnpm action deploy-design-preview。无 export-coding-handoff 时可手动按模板生成交接说明。

适用场景与限制:适用于设计导出、开发者交接和 Figma 导入。无 PNG 导出动作,需用户使用编辑器下载菜单;PDF 实际生成在浏览器端;无头 Chromium 不可用时 Figma SVG 导出返回 ok:false;Figma 会将 SVG 文本转为轮廓,不可再编辑为文字。