SuperAPI AI 工具集

stitch-ui-contract-vant

设计与创作

查看项目

更新于 10-15 21:48

技能介绍

用途:本技能把 Vant 4 设计规范变成可执行的 Stitch 输入,仅当用户明确提到 Stitch 时使用。它维护组件、token 与状态契约,供设计前约束使用,不生成业务页面代码;产品规格与最终提示词模式由 stitch-design-spec 统一维护。

主要能力:两种模式。Prefix 模式输出可直接粘贴到 Stitch [Context] 的硬约束前缀,含框架(Vant 4 / Vue 3 移动端)、设计 token(主色 #1989fa 等颜色、页面/卡片背景、14px 基准字号、圆角 sm=2px/md=4px/lg=8px)、组件契约(van-row/van-col、van-config-provider、van-cell-group inset、van-button、van-form/van-field 等表单、van-card/van-submit-bar 等业务组件、van-nav-bar/van-tabbar 等导航、van-action-sheet 等反馈)与布局不变量(375px 移动优先、Flexbox 对齐、尊重安全区)。Selector 模式依次输出 CONTRACT_SELECTION_JSON_V1 及拼装好的 Stitch 提示词,只注入所需组件/状态片段。

使用方式:由用户意图决定模式——要求美化/润色现有页面,或要求 selector / JSON / contracts.include / states.include 时用 Selector 模式;否则用 Prefix 模式。按名称使用 stitch-design-spec 统一编译提示词,不直接覆盖已应用系统或局部修改范围。安装说明:npx skills add full-stack-skills/stitch-skills --skill stitch-design-spec,不会自动安装。真实代码转换需使用对应 components 技能,不能以框架风格设计图代替代码验证。触发关键词包括 vant、vant4、vant-ui、vant ui,以及“vant 风格”“vant 组件库”。

限制:资料未提供价格、平台支持范围与效果保证。证据优先,结果缺失时标记 NOT_VERIFIED;写入、付费、发布等不可逆动作需明确授权;若需其他技能,按名称交接而不复制其正文。