用途：把 Stitch 设计稿转换为干净、模块化的 Vue 3 + Element Plus 代码（Vite、.vue SFC）。仅在用户明确提到“Stitch”并需要转换 Stitch 屏幕到 Vue 3 + Element Plus 时使用。
主要能力：通过 Stitch MCP（或 stitch-mcp-get-screen）获取屏幕元数据与 HTML；用技能内脚本和资源完成可靠抓取与质量检查；按架构规则拆分组件、隔离逻辑、解耦数据；将 Tailwind 工具类映射为 Element Plus 组件与主题。
使用方式：前置条件为 Stitch MCP Server、Node.js 与 npm、Stitch 项目与屏幕 ID。ID 获取有两种方式：从 Stitch 设计 URL 解析 projectId（路径）与 screenId（node-id 查询参数）；或无 URL 时用 stitch-mcp-list-projects 与 stitch-mcp-list-screens 发现并获取。先运行 list_tools 找到 MCP 前缀（如 mcp_stitch__stitch:），再调用 [prefix]:get_screen 获取设计 JSON、htmlCode.downloadUrl、screenshot.downloadUrl、尺寸与设备类型。高可靠 HTML 下载用 Bash 运行：bash scripts/fetch-stitch.sh "<htmlCode.downloadUrl>" "temp/source.html"，该脚本用 curl -L 处理重定向与 TLS，URL 需加引号。执行步骤：无 node_modules 时运行 npm install；创建 src/data/mockData.js；以 resources/component-template.vue 为基础起草组件；更新应用入口渲染新组件；对照 resources/architecture-checklist.md 检查并运行 npm run dev 验证。
架构规则：拆分为独立 .vue 文件，避免单个巨型 SFC；事件处理与组合式函数放入 src/composables/ 或 script setup；静态文本、图片 URL、列表移入 src/data/mockData.js（或 .ts）；优先使用 Element Plus 组件（如 el-card、el-alert、el-button、el-form、el-input、el-row/el-col），不用 div.card 或自定义 .card-header/.tips-text；生成组件省略第三方许可证头。
适用场景：Stitch 设计转 Vue 3 + Element Plus 项目；若 Stitch 由 stitch-ui-design-spec-element-plus 约束生成，映射到 Vue SFC 与 Element Plus 组件；从 Stitch HTML 转换时参考 references/tailwind-to-element-plus.md 与 references/contract.md；项目有 DESIGN.md 时对齐颜色与排版到 Element 令牌。
限制：仅限明确提及 Stitch 的场景；需 Stitch MCP、Node.js/npm 与有效项目/屏幕 ID；AI 抓取工具可能在 Google Cloud Storage URL 上失败，需用脚本下载；组件映射须遵循 references/contract.md。具体收费、价格、平台支持范围等资料暂未提供。