---
sidebar: aiSidebar
title: Skill（技能系统）
description: Skill 是一组可复用的执行规则与工作流，用来让 AI 在特定任务中更稳定地输出结果。
keywords:
- AI 编程
- LLM
- 工作流
- Skill
- 技能系统
- ai
- basics
- weapp-tailwindcss
- tailwindcss
- 小程序
- 微信小程序
- uni-app
- taro
- rax
- mpx
---
# Skill（技能系统）
## 概述
Skill 是一组可复用的执行规则与工作流，用来让 AI 在特定任务中更稳定地输出结果。
`weapp-tailwindcss` 提供的 Skill 目标是帮助用户在自己的业务项目中，快速接入并稳定使用 `weapp-tailwindcss`，用于小程序与多端开发。
> 这个 Skill 主要服务“项目使用者”，不是仓库二次开发维护指南。
在本项目中，我们采用 [`vercel-labs/skills`](https://github.com/vercel-labs/skills) 安装 Skill，技能文件为 `SKILL.md`。
## weapp-tailwindcss Skill 安装
### 1. 从 GitHub 安装（推荐）
```bash
npx skills add sonofmagic/skills --skill weapp-tailwindcss
```
### 2. 查看仓库可安装 Skill 列表
```bash
npx skills add sonofmagic/skills --list
```
### 3. 本地开发时安装当前目录 Skill
在本仓库根目录执行：
```bash
npx skills add . --skill weapp-tailwindcss
```
## 装完后能做什么
安装后，你可以让 AI 按你的项目类型直接产出可运行配置，例如：
- `uni-app cli vue3 vite` 项目接入方案
- `taro webpack5` / `taro vite` 项目接入方案
- `uni-app x` 同时构建 `Web` / 小程序 / `Android` / `iOS` / 鸿蒙
- 已有项目迁移、样式失效排障、`rpx` 任意值问题定位
- Tailwind 写法规范沉淀（含 `space-y-*` / `space-x-*` 在小程序端的标签限制与修复顺序）
Skill 会要求 AI 优先完成这些关键动作：
- 识别你当前框架和目标端
- 补齐 `tailwindcss` 与 `weapp-tailwindcss` 最小可用配置
- 明确 `postinstall` 中的 `weapp-tw patch`
- 给出“可复制命令 + 可复制配置 + 验证步骤”
- 对 `space-y-*` / `space-x-*` 问题按固定优先级排查：先改结构，再评估 `virtualHost`，最后扩展 `cssChildCombinatorReplaceValue`
## Skill 执行流程（更新）
当前 `weapp-tailwindcss` Skill 会把请求先分流，再输出结果：
1. 任务分流：新项目接入、存量迁移、问题排查、写法规范沉淀
2. 信息收集最小集：
- 框架（`uni-app` / `taro` / `uni-app x` / 原生）
- 构建器（`vite` / `webpack5` / `webpack4`）
- 目标端（仅小程序 / 小程序 + `H5/App`）
- Tailwind 版本（v3/v4）与包管理器（重点 `pnpm@10+`）
- Node 版本（建议 `^20.19.0 || >=22.12.0`）
3. 按任务读取对应参考文件：
- 集成/迁移：`references/integration-playbook.md`
- 排障：`references/troubleshooting-playbook.md`
- 写法规范：`references/tailwind-writing-best-practices.md`
## Skill 输出标准（更新）
Skill 输出会强制包含以下项目，避免只给概念不落地：
1. 结论（适用框架、Tailwind 版本、目标端）
2. 修改文件清单
3. 可直接复制的配置片段
4. 安装/运行命令（默认 `pnpm`）
5. 验证步骤与预期结果
6. 回滚方案（至少一条）
## 写法规范补充：space-y / space-x
在小程序里，`space-y-*`、`space-x-*` 这类依赖子组合器的工具类，默认不是“全标签通用”，通常会按 `view + view`（含 `text`）处理。
如果你遇到 `space-y-2` 不生效，建议按下面顺序处理：
1. 先改结构：让相邻子节点落在 `view/text`，或外层包一层 `view`
2. 再评估组件层：自定义组件场景启用 `virtualHost`
3. 最后改配置：仅在必要时扩展 `cssChildCombinatorReplaceValue`，并保持最小化标签范围
## 推荐提示词
1. 新项目快速接入
```text
我现在是 uni-app cli vue3 vite 项目，目标端是微信小程序 + H5。
请按 weapp-tailwindcss skill 给我最小可用配置，
输出需要包含：安装命令、完整配置文件、验证步骤。
```
2. 旧项目迁移
```text
这是一个 taro webpack5 老项目，已经有 tailwindcss 但样式经常丢失。
请按 weapp-tailwindcss skill 给迁移方案，并列出最小改动清单。
```
3. 问题排查
```text
我在 JS 字符串里写了 tailwind 任意值 class，但小程序端不生效。
请按 weapp-tailwindcss skill 给排查顺序，并指出应该检查的配置项。
```
4. `space-y` / `space-x` 不生效排查
```text
我的容器写了 space-y-2，但子节点是 button 和自定义组件，间距没有生效。
请按 weapp-tailwindcss skill 给固定优先级排查方案，并给出最小改动配置。
```
5. 要求带回滚方案
```text
这是一个 uni-app vite 项目，请按 weapp-tailwindcss skill 给我迁移方案。
输出必须包含：改动文件、可复制配置、验证步骤、回滚方案。
```
## Skill 文件位置
```text
skills/weapp-tailwindcss/SKILL.md
```
## Skill 参考文件位置
```text
skills/weapp-tailwindcss/references/integration-playbook.md
skills/weapp-tailwindcss/references/troubleshooting-playbook.md
skills/weapp-tailwindcss/references/tailwind-writing-best-practices.md
```
## 常见问题
### 安装后看不到 Skill
排查顺序：
1. 先执行 `npx skills add <repo> --list` 确认技能名。
2. 确认安装命令中的 `--skill weapp-tailwindcss` 名称完全一致。
3. 确认默认分支已包含 `skills/weapp-tailwindcss/SKILL.md`。
### 我是 Skill 维护者，如何发布版本
请查看：[Skill 发布与版本化](/docs/ai/basics/skill-release)
