3.如何在 OpenCode 中使用 skills如何在 OpenCode 中使用 skills。接下来我们将将介绍如

如何在 OpenCode 中使用 skills。

接下来我们将将介绍如何在 OpenCode 中使用 skills。

现在市面上已经有很多现成的 skills，我么可以直接拿来使用，我们可以在 skills.sh/ 查找更多的 skill。

安装方式：

npx skills add <owner/repo>

ui-ux-pro-max 接下来我们使用 ui-ux-pro-max 这个 skill 演示，地址：skills.sh/nextlevelbu…

UI/UX Pro Max 是一个 AI 设计智能技能（AI Skill），为构建专业级用户界面（UI）和用户体验（UX）提供结构化设计知识和自动化辅助，主要用于与 AI 编码助手集成（例如 Claude Code、Cursor、Windsurf 等）。

UI/UX Pro Max 包含一个可搜索的设计数据库，可根据自然语言提示智能推荐界面风格、配色、排版与组件实现方式。

1、项目本地安装 `ui-ux-pro-max` Skill

1.1 进入你的项目根目录

cd /你的/项目/目录

1.2本地安装（项目级别）

# 1. 作为开发依赖安装到当前项目
npm install --save-dev uipro-cli

# 2. 使用 npx 运行本地安装的 CLI
npx uipro init --ai opencode

优点：

只影响当前项目，不影响系统全局
可以在 package.json 中管理版本
符合 Node.js 最佳实践
团队协作时依赖明确

使用上面两个命令安装ui-ux-pro-max技能，出现invalid [tool=skill, error=Invalid input for tool skill: JSON parsing failed: Text: {"name":"} } <|tool_call_begin|> functions.glob:1 <|tool_call_argument_begin|> {"} <|tool_calls_section_end|>. Error message: JSON Parse error: Unrecognized token '<']错误，怎么解决

1.3 解决方法：不使用 AI 模式（最稳妥、100% 解决）

直接跳过 AI 生成，手动初始化项目，完全规避 JSON 解析错误：

卸载旧版本（可选，清理环境）

npm uninstall uipro-cli --save-dev

重新安装

npm install uipro-cli --save-dev

关键：去掉 --ai opencode，使用普通初始化

npx uipro init

然后选择opencode skill

1.4 手动安装（如果 CLI 不好用）

# 1. 新建目录
mkdir -p .opencode/skills/ui-ux-pro-max

# 2. 克隆仓库到临时位置
git clone https://github.com/nextlevelbuilder/ui-ux-pro-max-skill /tmp/ui-ux

# 3. 复制 SKILL.md 和资源到项目
cp -r /tmp/ui-ux/* .opencode/skills/ui-ux-pro-max/

1.5 验证是否生效

# 进入 OpenCode 对话
opencode chat

# 查看已加载的 Skills
/skill list

# 或直接触发
/ui

1.6 卸载方法

如果需要卸载：

# 1. 删除技能目录
rm -rf .opencode/skills/ui-ux-pro-max

# 2. 卸载依赖
npm uninstall uipro-cli

看到 ui-ux-pro-max 出现，就说明项目本地安装成功。

2、OpenCode Skills 原理（通俗+完整）

2.1 什么是 Skill？

Skill = 一个带元数据的 SKILL.md 文件 + 配套资源

本质：模块化、可复用、可共享的 AI 指令集 / 专业知识库

格式：

---
name: ui-ux-pro-max
description: 专业UI/UX生成，Tailwind + shadcn/ui + Framer Motion
version: 1.0.0
---

# 你是专业UI/UX专家...
## 设计规则
- 配色...
- 排版...
- 组件...

2.2 发现机制（Skill 放在哪、怎么被找到）

OpenCode 按优先级从高到低扫描：

项目本地（你要的）
```
项目/.opencode/skills/xxx/SKILL.md
```
全局（用户目录）
```
~/.config/opencode/skills/xxx/SKILL.md
```
兼容目录：.claude/skills/、.agents/skills/

项目本地 > 全局 → 同一个名字，项目优先。

2.3 核心机制：渐进式加载（Progressive Disclosure）

不是一次性把所有 Skill 全塞进上下文，而是分三层加载：

Level 1：元数据层（启动时加载）

只读：name + description
作用：告诉 AI “我有哪些能力”
极省 token（每个 Skill 约 100 token）

Level 2：核心指令层（触发时才加载）

当你说：
- “做一个登录页”
- /ui
- /skill use ui-ux-pro-max
OpenCode 才把 整个 SKILL.md 正文 注入 AI 上下文

Level 3：资源层（执行时按需读）

图片、模板、脚本、文档等
不进 AI 上下文，本地直接读取使用

2.4 调用方式（3 种）

自动触发
- AI 看你的问题 + Skill 的 description
- 匹配上就自动启用该 Skill

手动点名（推荐）

/skill use ui-ux-pro-max
帮我做一个首页

快捷命令（Skill 自带）
```
/ui
```

2.5 为什么要这么设计？

上下文极轻：不用每次对话背几十上百个 Skill
速度快、成本低：token 只花在“真要用”的 Skill
可无限扩展：装 100 个 Skill 也不卡
项目隔离：不同项目用不同 Skill，互不干扰

3、本地 vs 全局（一句话区别）

项目本地（.opencode/skills）
- 只对当前项目生效
- 可提交到 Git，团队共享同一份 Skill
- 你现在要的方式
全局（~/.config/opencode/skills）
- 所有项目都能用
- 个人常用通用 Skill

4、常用 Skill 命令（本地项目版）

# 查看当前项目所有 Skills
/skill list

# 手动启用
/skill use ui-ux-pro-max

# 禁用
/skill unuse ui-ux-pro-max

# 重新加载（改了 SKILL.md 后）
/skill reload

# 直接用快捷指令
/ui

3.如何在 OpenCode 中使用 skills