跳到主要内容

Skill(技能系统)

weapp-tailwindcss 官方 Skill 面向业务项目使用者。它把当前 v5 的接入、迁移、排障和高级能力拆成独立工作流,避免一个大 Skill 同时维护所有框架与 API。

本项目使用 vercel-labs/skills 安装 Skill。sonofmagic/weapp-tailwindcss 是内容事实源,sonofmagic/skills 是面向用户的聚合安装仓库。

安装完整套件

npx skills add sonofmagic/skills \
--skill weapp-tailwindcss \
--skill weapp-tailwindcss-setup \
--skill weapp-tailwindcss-migrate \
--skill weapp-tailwindcss-troubleshoot \
--skill weapp-tailwindcss-runtime \
--skill weapp-tailwindcss-custom-build \
--skill weapp-tailwindcss-react-native \
-y

只安装兼容协调入口也可以:

npx skills add sonofmagic/skills --skill weapp-tailwindcss

协调入口负责识别任务并推荐专用 Skill;完整实现和参考资料位于各专用 Skill 中。

查看聚合仓库全部可安装内容:

npx skills add sonofmagic/skills --list

Skill 分工

Skill使用场景
weapp-tailwindcss泛化请求、任务识别、安全基线与兼容入口
weapp-tailwindcss-setup新接入、框架选型、Tailwind CSS 4 与多端配置
weapp-tailwindcss-migratev4 到 v5、旧 patch/生成插件与环境迁移
weapp-tailwindcss-troubleshoot样式生成、class 转译、rpx、HMR 和运行端排障
weapp-tailwindcss-runtime动态 class、merge、cva、variants 与 escape/unescape
weapp-tailwindcss-custom-buildCore API、自研 bundler、样式注入和分包隔离
weapp-tailwindcss-react-nativeExpo Metro、Native manifest 和 Android/iOS 运行时

当前共同基线

  • 当前主线只维护 Tailwind CSS 4。
  • 当前 weapp-tailwindcss manifest 要求 Node.js ^22.18.0 || >=24.11.0;HBuilderX 项目至少使用 5.11。
  • 同一次受管构建只由 WeappTailwindcss 生成 Tailwind CSS,不叠加官方 Tailwind PostCSS/Vite 生成插件。
  • Tailwind 入口使用纯 CSS,必须被项目实际导入;cssEntries 使用绝对路径且不能替代构建图导入。
  • H5/Web 通常保留插件,由 generator 自动选择 Web target。
  • JavaScript class 只转换 Tailwind 验证过的 classNameSet 精确候选。

本地开发安装

在本仓库根目录执行:

npx skills add . \
--skill weapp-tailwindcss \
--skill weapp-tailwindcss-setup \
--skill weapp-tailwindcss-migrate \
--skill weapp-tailwindcss-troubleshoot \
--skill weapp-tailwindcss-runtime \
--skill weapp-tailwindcss-custom-build \
--skill weapp-tailwindcss-react-native \
-y

提示词示例

使用 $weapp-tailwindcss-setup,为新的 uni-app Vue3 Vite 项目配置微信小程序和 H5,给出完整文件与验证步骤。
使用 $weapp-tailwindcss-migrate,把仍在运行 weapp-tw patch 和 @tailwindcss/vite 的旧项目迁移到 v5。
使用 $weapp-tailwindcss-troubleshoot,定位为什么新加的任意值 class 在第二次 HMR 后不再生成。
使用 $weapp-tailwindcss-custom-build,设计基于 weapp-tailwindcss/core 的内存转换和分包样式注入时序。
使用 $weapp-tailwindcss-react-native,为 Expo SDK 54 配置 Metro 并验证 manifest warnings。

维护与验证

源码位于 skills/<skill-name>/。每个目录包含 SKILL.mdagents/openai.yaml 和按需加载的 references/

pnpm skills:validate
npx skills add . --list

发布链路见:Skill 发布与同步