Skip to content

AI 开发 ​

SinleUI 为 Vibe Coding Harness(Claude Code、Codex、ZCode、DeepSeek Harness、Cursor、WorkBuddy、Trae等)提供了可安装的 Skill,以提供插件附带的组件与 API 能力清单。AI 可以据此查找框架已有能力,按框架规范生成页面和功能,减少重复实现和属性误用。

为什么需要这些资料 ​

SinleUI 基于 uni-app x 框架开发,使用本插件时与普通 Vue 项目有不少差异,AI 按通用 Vue 项目的写法生成代码时,容易忽略以下几点:

  • 组件名、props 和事件由框架定义,需要查阅后再使用;
  • 页面根节点必须是 sn-page,否则主题变量会失效;
  • 尺寸和颜色使用 $ 动态值与 --sn-* 变量,不能都按固定 px 与十六进制色值处理;
  • 原生端需要自定义基座,生成方案时也要考虑这一前提。

在开始任务前提供能力清单和这些约定,可以减少因框架用法不符而产生的返工。

本栏目内容 ​

  • Skill:下载并安装 sinleui-app-dev,供 AI 查阅框架规范。
  • 适配指南:安装后如何描述需求、检查结果。
  • 实践经验:使用 AI 开发页面时的任务安排与检查建议。

能力清单 ​

能力清单有两个入口,按是否联网选择:

  • 联网时:文档站提供 llms.txt 分组索引与逐页 .md(如 https://sinleui.pages.dev/components/sn-button.md),AI 可直接抓取,无需解析 HTML;也可用 llms-full.txt 一次读完全部页面。
  • 离线时:插件内的 uni_modules/sinle-ui/ai-reference.md 是单文件索引,覆盖同样的组件与 API,每一项都带文档站链接。

ai-reference.md 是自动生成的派生产物(源是 Skill 的 references/ 索引),随插件一起分发:

部分内容
开工前必读页面根节点、easycom、$ 动态值等硬约束
框架核心能力全部 hooks 的用途与导入方式
组件清单全部组件的分类、用途简述与文档链接
API$snui、snu、核心库、导出常量与类型的概述
组合速记列表项、弹层、页面骨架、主题色、尺寸的常见写法

文件位置:uni_modules/sinle-ui/ai-reference.md。

保持同步

能力清单随框架代码维护。新增、修改或删除组件与 API 时,会同步更新清单。请勿直接编辑 ai-reference.md——它由 Skill 的索引生成,改动应落到 Skill,再重新生成并校验。 使用旧版插件时,请结合当前代码和文档站核对用法。

使用 MIT 协议