lijiaming123/stitch-to-vue3
.cursor/skills/stitch-vue-components/SKILL.md
将 Stitch 设计稿一键转换成高质量、可直接运行的 Vue3 组件，使用 <script setup>、Tailwind CSS、Typescript符合 Cursor 工程规范，保持设计还原度与可维护性。
development
Updated Apr 16, 2026
$ install --global
skillsauthnpx skillsauth add lijiaming123/ai-plan stitch-to-vue3Install this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 16, 2026, 12:43 PM20.0s1 file scanned
SKILL.md
- name:
- stitch-to-vue3
- description:
- 将 Stitch 设计稿一键转换成高质量、可直接运行的 Vue3 组件，使用 <script setup>、Tailwind CSS、Typescript符合 Cursor 工程规范，保持设计还原度与可维护性。
- isSkill:
- true
Stitch to Vue3 组件转换（Cursor 专用）
触发条件
用户输入包含以下任意内容时自动启用：
- stitch 转 vue3
- 把stitch 设计稿转代码
- 把 stitch 转 vue 组件
- convert stitch to vue3
- 导出 stitch 为 vue3
核心能力
- 解析 Stitch 导出的结构、图层、样式、布局、间距
- 自动生成 Vue 3 <script setup> 单文件组件
- 样式输出：Tailwind CSS v3
- 1:1 还原设计稿：排版、颜色、间距、圆角、层级
- 自动识别：按钮、输入框、卡片、容器、图片、文字、图标
- 自动处理响应式布局
- 自动提取可复用变量、避免硬编码
- 自动优化结构，减少多余 div 嵌套
输出格式（强制执行）
<script setup>
// 业务逻辑、props、事件、状态
// 简洁、无冗余
</script>
<template>
<!-- 语义化结构，严格按 Stitch 图层 -->
</template>
<style scoped>
/* 仅在 Tailwind 无法实现时使用 */
</style>
Related Skills
lijiaming123/writing-skills
testing
VerifiedTrustedCommunity
Use when creating new skills, editing existing skills, or verifying skills work before deployment
SKILL.mdUpdated Apr 16, 2026
lijiaming123/writing-plans
development
VerifiedTrustedCommunity
Use when you have a spec or requirements for a multi-step task, before touching code
SKILL.mdUpdated Apr 16, 2026
lijiaming123/vue3-element-plus
tools
VerifiedTrustedCommunity
专业使用 Vue3 + <script setup> + Element Plus 开发组件、表单、表格、弹窗、页面，遵循最佳实践、类型安全、优雅结构、可维护性。
SKILL.mdUpdated Apr 16, 2026
lijiaming123/verification-before-completion
data-ai
VerifiedTrustedCommunity
Use when about to claim work is complete, fixed, or passing, before committing or creating PRs - requires running verification commands and confirming output before making any success claims; evidence before assertions always
SKILL.mdUpdated Apr 16, 2026