用途：当用户明确提到“Stitch”并需要把 Stitch 设计稿转换为 Vue 3 + Bootstrap（Vite、.vue 单文件组件、BootstrapVue Vue 3 支持或 BootstrapVueNext）时使用本技能。目标技术栈为 Vue 3 + BootstrapVue Vue.js 3 Support（@vue/compat）或 BootstrapVueNext（Bootstrap 5 + Vue 3）。
前提条件：需 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:），再用 projects/{project}/screens/{screen} 调用 get_screen，获取设计 JSON、htmlCode.downloadUrl、screenshot.downloadUrl、尺寸与设备类型。HTML 下载建议用 Bash 执行脚本：bash scripts/fetch-stitch.sh "<htmlCode.downloadUrl>" "temp/source.html"（URL 需加引号）。用截图确认布局细节。
架构规则：拆分为独立 .vue 文件，避免单个巨型 SFC；事件处理与组合式函数放入 src/composables/ 或 script setup；静态文本、图片 URL、列表移入 src/data/mockData.js（或 .ts）；只使用 Bootstrap 框架组件，如 b-card、b-alert、b-container、b-row、b-col、b-button，避免 div.card 或 <button class="btn"> 等原生写法；生成的组件省略第三方许可证头。
执行步骤：无 node_modules 时运行 npm install；根据设计内容创建 src/data/mockData.js；以 resources/component-template.vue 为基稿替换占位符与 Bootstrap 标签；更新应用入口（如 App.vue 或路由）渲染新组件；按 resources/architecture-checklist.md 检查并运行 npm run dev 视觉确认。
集成说明：若 Stitch 由 stitch-ui-design-spec-bootstrap 约束生成，映射到 Vue SFC 与 Bootstrap Vue 组件；若从 Stitch HTML 转换，参考 references/tailwind-to-bootstrap.md 做 Tailwind 工具类到 Bootstrap 的映射，再按 references/contract.md 处理组件 API；若项目有 DESIGN.md，对齐其颜色与间距到 Bootstrap token。
限制与排错：本技能仅在用户明确提及 Stitch 并针对 Vue 3 + Bootstrap 时触发；抓取失败时给 URL 加引号并确保脚本可执行；组件映射须遵循 contract；写入、发布等不可逆动作需明确授权；证据缺失标记 NOT_VERIFIED。未提供具体收费、价格或效果信息。