Skip to content

Skill ​

sinleui-app-dev 是供 AI 编码助手使用的 SinleUI Skill。安装后,AI 可以查阅框架规范,减少每次对话中重复说明的内容。

下载 ​

下载 sinleui-app-dev.zip

压缩包内是一个标准 Skill 目录:

sinleui-app-dev/
├── SKILL.md                        技能入口:工作流、五条硬约束、按任务查
└── references/
    ├── component-index.md          全部组件:能干什么 + 文档链接
    ├── api-index.md                全部 API 与 hooks:能干什么 + 文档链接
    ├── page-structure.md           页面结构规则 + 相关文档链接
    ├── style-rules.md              尺寸与颜色规则 + 相关文档链接
    ├── recipes.md                  常见组合速记(列表项 / 骨架 / 弹层 / 尺寸颜色)
    └── checklist.md                交付前自查清单

内容与文档的分工 ​

Skill 主要提供以下三类信息,组件和 API 的具体用法仍需查阅文档:

  1. 框架提供的能力,以及各自的用途和文档链接;
  2. 必须遵守的要求(sn-page 根节点、$ 动态值、--sn-* 变量、easycom、不改 uni_modules/);
  3. 交付前需要检查的项目。

框架有一百多个组件,如果把 props 表全部放进 Skill,文件会很长,维护时也容易遗漏。因此,具体用法统一链接到文档站,Skill 用来帮助 AI 找到相关页面。

使用流程

AI 接到任务后,先通过索引选择组件,再阅读对应文档页的属性表,最后按规则写代码、对照清单自查。这样能减少凭记忆编写代码的情况,也能控制上下文的长度。

安装 ​

不同工具的技能目录有所区别,下表列出了一些常见位置:

工具常见位置
Claude Code~/.claude/skills/(全局)或项目内 .claude/skills/
CodeBuddy / Trae / Qoder各工具技能目录(如 .codebuddy/skills/、.trae/skills/)
支持 AGENTS.md 类约定但不支持 Skill 的工具见下方「不支持 Skill 时」

解压后,将整个 sinleui-app-dev/ 目录放入技能目录,并保留内部目录结构。SKILL.md 通过相对路径引用 references/ 下的文件。

确认安装

不清楚技能目录时,可以在工具中询问,或查阅该工具的文档。安装后,新建对话让 AI 写一个 SinleUI 页面,检查它是否读取了组件索引,并使用 sn-page 作为根节点。

不支持 Skill 时 ​

不支持 Skill 的工具也可以使用压缩包中的 Markdown 文件:

  • 支持在对话开头注入上下文时,将 SKILL.md 贴入上下文;
  • 支持自定义指令 / 自定义 prompt 的工具,可以将 SKILL.md 作为指令内容;
  • 不支持上述方式时,在任务开头要求 AI「先读 <解压路径>/sinleui-app-dev/SKILL.md,按里面的规范写」。

SKILL.md 内容较短,也便于通过这种方式加入对话上下文。

使用范围 ​

Skill 会引导 AI 优先选择框架已有组件、按 sn-page 组织页面、使用 $ 与 CSS 变量处理尺寸和颜色、查阅文档,并在交付前对照清单检查。查不到所需能力时,应明确说明「框架未提供」。

不得编造组件与属性、修改 uni_modules/ 下的框架代码,或将未验证的结果写成已验证。编译与真机验证是否执行,仍以当前环境和项目规则为准。

让 AI 直接抓取文档 ​

除 Skill 之外,文档站还按 llms.txt 约定提供了可直接抓取的索引,便于 AI 在不下载 Skill 时也能拿到完整页面内容:

地址内容
https://sinleui.pages.dev/llms.txt分组索引:每个组件 / API 页面的标题、一句话说明与 Markdown 链接
https://sinleui.pages.dev/llms-full.txt全部页面的 Markdown 合订本,可一次性读完
https://sinleui.pages.dev/components/sn-button.md任取一页的 Markdown 版本(组件、API、核心库同理)

也就是说,AI 既能用 Skill 查「框架有什么」,也能直接抓 .md 拿「这个组件怎么用」,无需解析 HTML。在提示词里可以直接写:

text
先读 https://sinleui.pages.dev/llms.txt,再按需读取对应组件的 .md 页面。

生成方式

llms.txt / llms-full.txt / 逐页 .md 均为自动生成的派生产物,随文档站一起发布。请勿直接编辑这些文件,改动应落到对应的源文档上,再重新运行生成脚本。

离线索引 ​

插件中的 uni_modules/sinle-ui/ai-reference.md 也按索引形式列出了组件、hooks 与 API 的用途,每一项都带文档站链接。能联网时,Skill 会引导 AI 查阅文档站与 llms.txt;联网不便时,可以读取这份离线索引。

它是自动生成的派生产物:源是 Skill 目录下的 references/,由 tools/gen-ai-reference.mjs 生成,请勿手动编辑。需要更新时,先改 Skill 索引,再重新生成,并用 --check 校验两者是否一致。

更新 ​

Skill 随框架一起维护,下载包与文档站同步发布。需要更新时,重新下载并覆盖原目录即可。

维护说明

下载包由 tools/pack-skill.ps1 从 docs/public/skills/sinleui-app-dev/ 生成,-Check 可校验两者是否一致。

使用 MIT 协议