Vibe coding(AI编程一网打尽)

AKclown2026-02-24 17:13

前言

近一年来vibe coding席卷全球，现在很多公司都开始并且要求使用AI编程工具，我本人使用过类似Cursor这种IDE形式工具，也是使用codex、Claude code这种ClI工具。接下来我就使用Open code这款开源的代码agent工具来从头过一遍rules、command、agent、抓取agent请求分析、MCP服务、skills这些基础概念以及使用，也方便后续我自己能够快速查找对应的内容。主要先用起后续在深入agent开发。

opencode的使用

1. 安装

bash 复制代码 
npm install -g opencode-ai

2. 创建next.js项目（用于演示）

bash 复制代码 
pnpm create next-app@latest ai-coding --yes

3. 进入到ai-coding目录，执行opencode，出现如下界面表示成功

4. 配置第三方模型

opencode也提供一些免费的模型，例如Kimi K2.5、GLM-4.7等等，可以通过命令/modles来查看，后面有FREE表示免费标识。 为了达到演示效果，接下来我将配置Google的gemini服务。当然你也可以选择其他模型提供商，例如OPEN AI、GITHUB Copilot等

  • 配置opencode-antigravity-auth插件，该插件用于在opencode启用OAuth 对 Antigravity（Google 的 IDE）进行身份验证，这样就可以通过谷歌凭证访问Antigravity的模型。例如 gemini-3-pro 和 claude-opus-4-5-thinking

    • 方式一: 让AI agent自动帮我们完成opencode-antigravity-auth安装 (让LLM处理)
    ts 复制代码 
    Install the opencode-antigravity-auth plugin and add the Antigravity model definitions to ~/.config/opencode/opencode.json by following: https://raw.githubusercontent.com/NoeFabris/opencode-antigravity-auth/dev/README.md
    • 方式二:
      编辑~/.config/opencode/opencode.json文件，追加如下内容
    perl 复制代码 
    {
  "plugin": ["opencode-antigravity-auth@latest"]
}

    • 登录认证

      opencode auth login

在进行认证的时候，无法完成Goole谷歌大概率是VPN墙的问题。导致了如下两个链接无法访问

bash 复制代码 
https://oauth2.googleapis.com/token
https://www.googleapis.com/oauth2/v1/userinfo

可以通过postman主动去获取这两个数据，并且修改它的插件代码既可以绕过请求。在之后遇到授权问题时，可以通过debugger这个插件来排查是哪一步存在问题
<主机目录>/.cache\opencode\node_modules\opencode-antigravity-auth

关于opencode中Oauth认证的流程如下图:

尴尬的是这样子绕过了登录流程的，虽然能够获取到Gemini模型列表了，但是已经模型请求依旧显示网络异常，所以还是要解决CLI不能使用系统代理问题。

提示: 通过解决上面的授权，我们能够更加清晰的知道整个授权流程是怎么样的，以及可以确定插件内部无法发送oauth2.googleapis.com导致，而不是其他问题导致的

我的翻墙工具存在终端代理的命令，只需要将这个命令输入到你需要执行opencode的窗口，然后就可以正常使用模型了。如果你的Clash应该存在TUN模式打开即可

perl 复制代码 
export https_proxy=http://127.0.0.1:50750 http_proxy=http://127.0.0.1:50750 all_proxy=socks5://127.0.0.1:50751

5. oh-my-opencode (多代理协作插件)

用 Claude 做编排，用 GPT 做推理，用 Kimi 提速度，用 Gemini 处理视觉。模型正在变得越来越便宜，越来越聪明。没有一个提供商能够垄断。我们正在为那个开放的市场而构建。Anthropic 的牢笼很漂亮。但我们不住那。

核心理念

很多人使用 AI 编程工具会经历从"惊艳"到"冷静"的过程：写小功能很快，但一到重构、迁移、补测试、清 ESLint 警告等大型任务就容易卡壳。Claude-code中这个问题也是存在的, 在Cladue上面有Ralph插件来做这个事儿, 但OpenCode则有更强的 Oh-My-OpenCode 插件：

  • 不是简单叠加 UI，而是将"单模型"升级为多代理协作系统
  • 通过主控代理 Sisyphus 负责任务拆分、委派、推进
  • 把不同类型的工作分派给不同角色的代理，模拟真实开发团队的协作方式
代理角色
角色 职责
Sisyphus（主控） Tech Lead + 项目经理组合，负责拆解 TODO、分配任务、推动进度
Oracle 架构设计、深度调试、复杂问题分析
Librarian 文档检索、API 查阅、资料收集
Explore 代码库探索、依赖分析、边界定位
Frontend Engineer UI/UX 设计、前端组件开发
工作模式

ultrawork（或简写 ulw）是核心的工作模式开关：

复制代码 
小任务：正常使用即可
大任务（跨文件/跨模块/需要查资料/需要持续推进）：开启 ultrawork 更稳

当开启 ultrawork 时，系统会：

  • 并行探索代码库
  • 启动后台任务
  • 强力推进直到完成

到目前我们完成opencode的安装以及关联第三方提供商，接下来就来了解一些关于AI agent的一些常见概念以及使用

常用的command

接下来学习一下opencode中常用且好用快捷操作命令有哪些? 帮你提效AI工具

快捷键 功能 说明
Ctrl+X -> N 新建会话 ctrl+x同时按，然后松开再按N
Ctrl+X -> L 会话列表 ctrl+x同时按，然后松开再按N
shift+Enter 换行(不发送) 用于多行提示词
⬆/⬇ 切换历史记录 用于多行提示词
ESC 中断这次会话 中断这次会话
Ctrl+X -> M 打开模型列表 切换模型列表
Ctrl+X -> U 撤销(undo) 回退到这次对话初始状态(觉得这次对话不好)
Ctrl+X -> R 重做(redo) 重回到这一次undo之前
F2 切换最近模型 快捷切换最近使用的模型
Ctrl+X -> y 复制AI消息 复制AI的完整回复
Ctrl+X -> B 切换侧边栏 查看会话饼图
PageUp/Down 滚动对话 快速浏览长对话

关于AGENTS.md文件

AGENTS.md是一个markdown文件，我们可以将其提交到Git仓库中，用于自定义AI编码代理在仓库中的行为。它位于对话记录的顶部，紧邻系统提示符下方。(该文件不是必须的)

1. 为什么需要写AGENTS.md？

AGENT非常擅长局部修改，但缺乏上下文时容易"跑偏"。AGENTS.md 就像一张地图：告诉它命令在哪里，用什么测试、PR 怎么写、哪些操作禁止。顺带一提，这也能帮助新同事快速融入团队。

2. AGENTS.md如何查找呢？（Monorepos）

关于AGENTS.md文件查找跟node_modules的查找方式类似，以就近文件优先进行查找

bash 复制代码 
repo/  
├─ AGENTS.md            # 全仓默认规则  
├─ apps/  
│  └─ web/  
│     ├─ AGENTS.md      # 仅对 /apps/web/** 生效  
│     └─ src/components/Button.tsx  
└─ packages/  
   └─ api/  
      ├─ AGENTS.md      # 仅对 /packages/api/** 生效  
      └─ src/routes/users.ts

3. 可选的AGENTS.override.md

有时可能需要一份临时、优先级更高的规则，例如发布封板、事故应急、合规冲刺等

• 该文件名只是约定，不是标准；只有部分工具/CLI 会自动识别。

• 如果工具不支持，可通过命令行额外指定策略文件实现同样效果。

• 建议"少量、明确、短期"：写清目的、约束内容、结束条件，窗口结束后立即删除。

csharp 复制代码 
repo/  
├─ AGENTS.md  
├─ AGENTS.override.md        # 全仓临时规则（若被支持）  
└─ packages/  
   └─ api/  
      ├─ AGENTS.md  
      └─ AGENTS.override.md  # 仅 API 范围的事故模式（若被支持）

4. 针对过大的agents.md文件可能来自于如下原因:

agents.md文件会在每次对话开始时自动加载，让Agent能立即了解的我们的项目。因此表明agent.md文件不宜过大才不会占用过多的上下文和消耗过多的token

vbnet 复制代码 
It's automatically loaded at the start of every conversation, giving the agent immediate understanding of your project.
  • 不同的开发者添加了相互矛盾的建议，没有人能够完成完整风格，难以维护的混乱实际上损害了Agents的性能。
  • 另一个罪魁祸首：自动生成的 AGENTS.md 文件。 切勿使用初始化脚本自动生成 AGENTS.md。 他们在文件中充斥着"对大多数情况有用"但最好逐步披露的内容。 生成的文件优先考虑全面性而不是限制性

对于agents.md会在每一次会话中都会加载，无论这个agents.md内容是否相关，这会导致token浪费问题

设想 影响
轻量、专注的agents.md 有更多的token用于特定的任务
体积庞大、臃肿的agents.md 用于实际工作的tokens变少、agent会感到困惑
不相干的说明 tokens的浪费 + agent分心 = 浪费性能

意味编写的agents.md文件应该尽可能的小。 同时也需要注意要保持agent.md文件的更新，不要使用过时的agent.md文件

5. AGENTS.md文件内容

一般情况agents.md包含下面几大类既可以了，而且尽可能极简

  1. 整个项目的架构和模式(技术栈、项目结构)
  2. 遵循我们的编码风格和规范(代码规范)
  3. 声明正确的命令进行构建和测试(包管理工具、构建命令)
  4. 避免已知的陷阱和反模式(已知问题)
  5. 做出符合你的偏好的决策

推荐agents结构

ts 复制代码 
# AGENTS.md

## Project overview
Brief description of what this project does and its primary purpose.

## Tech stack
- Framework: Next.js 14 with App Router
- Language: TypeScript (strict mode)
- Database: PostgreSQL with Prisma ORM
- Styling: Tailwind CSS

## Architecture
Explain the codebase structure and key patterns.

## Commands
```bash
bun install        # Install dependencies
bun run dev        # Start development server
bun run test       # Run tests
bun run build      # Production build
```

## Code style
- Prefer functional components
- Use early returns
- Name files in kebab-case
- Write tests for business logic

## Patterns to follow
Document established patterns in the codebase.

## Things to avoid
List antipatterns and common mistakes.

6. 使用渐进式披露

不要将所有的内容都塞进AGENTS.md中，而是使用渐进式披露。仅向Agent提供其当前所需要的内容，并在需要时将其指向其他资源。

模型启动时会加载所有 Skills 的基本信息（名称和用途），但不会读取具体内容。只有当模型真正需要某个 Skill 来指导工作时，才会去读取那份文档的详细内容。这种按需加载的方式，就是渐进式披露。

将特定语言的规则移至单独的文件。

如下文件属于属于大包大揽行为在开启会话的时候会将所有agent.md内容都加载到会话中 针对上一个文件进行渐进式披露优化，agents.md只包含大纲内容，不会再初次开启会话时就将agent.md所有的内容都加载而是使用才加载对应的规则。例如当编写Typescript的时候才会去加载TypeScript Conventions，可以理解为按需加载

7. 如何重构AGENTS.md文件

如果我们对已有的agents.md感觉到困惑难以维护，使用如下提示词以渐进式的公式重构我们的提示词。

ts 复制代码 
I want you to refactor my AGENTS.md file to follow progressive disclosure principles.

Follow these steps:

1. **Find contradictions**: Identify any instructions that conflict with each other. For each contradiction, ask me which version I want to keep.

2. **Identify the essentials**: Extract only what belongs in the root AGENTS.md:
   - One-sentence project description
   - Package manager (if not npm)
   - Non-standard build/typecheck commands
   - Anything truly relevant to every single task

3. **Group the rest**: Organize remaining instructions into logical categories (e.g., TypeScript conventions, testing patterns, API design, Git workflow). For each group, create a separate markdown file.

4. **Create the file structure**: Output:
   - A minimal root AGENTS.md with markdown links to the separate files
   - Each separate file with its relevant instructions
   - A suggested docs/ folder structure

5. **Flag for deletion**: Identify any instructions that are:
   - Redundant (the agent already knows this)
   - Too vague to be actionable
   - Overly obvious (like "write clean code")

rules （角色）

rules是给agents一个行为准则，当我们发现需要反复告诉AI同样的事情时就需要Rules了。例如问答时使用英/中回答、回复时需要精简回答、遇到不确定的事情需要告知用户、系统环境、用户偏好设置及其他无法通过代码编译器或检查器管理发现的实现细节

  • rules的特点

    1. 一次设置，长期生效
    2. 定义AI的人设和行为模式
    3. 适合长期稳定的需求

  • rules的缺点

    1. 只能定义做什么和不做什么无法定义怎么做
    2. 无法包含复杂的操作步骤
    3. 仍然比较抽象

如何写好rules可以根据cursor中的最佳实践来实现

示例

下面来看看加了rules和没有加rules的区别，如下是我的提示词，有规则和没有规则只有生成的文件名称和导出变量不同

csharp 复制代码 
在当前目录下新建一个hooks-by-rules.ts,创建一个名称为useListByRules的hooks方法。请求url为请求地址参数，params为请求参数，返回对应的loading、pageSize、total等参数以及refresh、getList、changePage等方法
  • hooks.ts文件是还没有创建rules规则时创建的hooks，会有堆的loading、error的useState
  • hooks-by-rule.ts文件是具备rules规则时创建的hooks，采用了@tanstack/react-query的useQuery来实现 如下是我的hook.mdc规则编写，声明了需要使用useQuery方式来实现。 针对rules你可以自己写一部分然后让agent帮你完善或者改进
    • globs声明作用域文件
    • description标识当前rule的限定范围
    • alwaysApply 是否应用于每次会话

目前我在opencode.json中配置了，agent并没有自动读取我的rules。(暂时不知道为什么)

ts 复制代码 
{
  "$schema": "https://opencode.ai/config.json",
  "instructions": [
    ".opencode/rules/*.md"
  ]
}

为了让opencode自动读取我的rules，我在agent.md文件追加了如下内容 是不是觉得rules跟agent.md文件的能力差不多?

是的，你没有理解错。agent.md只是rules的更简单的一种方式，它是纯markdown文件，没有结构化配置或元数据头部(就是头部不需要声明globs、description、alwaysApply定义)。它适用于项目规则比较简单的场景，Agent.md更加轻量、更易读的指导说明替代方案

MCP(模型上下文协议)

MCP是由Claude背后的公司Anthropic开放的标准。虽然听起来很有技术性，但是核心思想很简单。为AI Agent代理提供统一的方式来连接工具、服务和数据。

使用MCP即插即用。agent可以将结构化请求发送到任何MCP兼容工具，实时获取结果，甚至将多个工具链接在一起，无需提前了解具体细节

MCP Server的调用方法，当用户在AI Agent提问的时候，会将MCP作为system提示词发送给LLM,其中提示词包含了这个MCP的能力描述，以及对应的API能力(有点类似一个插件的API文档)，然后LLM模型就知道了该MCP具备什么能力，从而能够判断是否需要调用MCP Server来实现你的需求。 后续在抓取请求会在分析具体传递的MCP数据会更加直观。

接下来实战一下MCP Server的使用,你也可以通过awesome-mcp-servers、smithery.ai来查找你需要的MCP服务

Chrome Devtools Mcp

在使用Agent工具调试前端项目的时候，是不是经常遇到这样一个痛点。Agent没办法获取到浏览器控制台的信息，导致你在调试的时候都需要手动的告知或复制对应信息给Agent工具，它才能帮你修复bug问题。下面通过集成 chrome-devtools-mcp来解决这一痛点

Chrome Devtools Mcp的时候，让我们的code agent能够实时的检测和控制谷歌浏览器。它充当模型上下文协议(MCP)服务器，使我们的code agent能够访问Chrome Devtools的全部功能，实现可靠的自动化、深度调试和性能分析

在没有集成Chrome Devtools Mcp的时候，openCode编程工具并不能直接访问读取我们的谷歌浏览器的控制面板

接下来我们来实现一下在opencode集成Chrome Devtools Mcp，当我根据文档在~/.config/opencode/opencode.json中配置如下配置，然后通过/mcps查找发现Chrome Devtools Mcp属于disabled状态。但是并没有任何报错，因此我们可以通过向Agent提问来解决这个问题。

ts 复制代码 
 "mcp": {
    "chrome-devtools": {
      "type": "local",
      "command": ["npx", "-y", "chrome-devtools-mcp@latest"],
      "enabled": true
    }
  }

通过在Agent中输入npx -y chrome-devtools-mcp@latest加上我在前面问为什么配置的MCP为disabled状态。那么模型会自动思考这个问题，发现我本地的Node版本低了一点。（在使用coding agent工具的时候，定位问题方式跟传统定位问题方式也有所改变，我们应该先让Agent帮我分析一下可能的问题，让Agent自己尝试解决问题） 可以通过Space空格键切换mcp的disabled或者enable状态

复制代码 
打开github找到chrome-devtools-mcp项目，给他点个star

在命令行输入如上prompt来看看是否Chrome Devtools Mcp是否配置成功，因为默认启动新的Chorm实例的沙盒环境因此没有登录信息，opencode会提示你登录用户信息，当你登录完成在叫opencode帮你继续执行即可。

默认chrome-devtools-mcp都会启动新 Chrome 实例的沙盒环境中运行 MCP 服务器。在沙盒环境中用户登录信息无法共享，那么如何将mcp链接到正在运行的Chrome实例呢?

  1. 在mcp配置文件中添加--browser-url选项,这个选项值是正常运行Chrom实例的URL地址。默认为http://127.0.0.1:9222地址
json 复制代码 
 "mcp": {
    "chrome-devtools": {
      "type": "local",
      "command": ["npx", "-y", "chrome-devtools-mcp@latest","--browser-url=http://127.0.0.1:9222"],
      "enabled": true
    }
  }
  1. 启动Chorme浏览器
    针对该文章更改了远程调试开关以提高安全性，从 Chrome 136 开始，我们将更改 --remote-debugging-port 和 --remote-debugging-pipe 的行为如果尝试调试默认的 Chrome 数据目录，系统将不再遵循这些开关。，这些开关必须与 --user-data-dir 开关搭配使用,才能指向非标准目录。非标准数据目录使用不同的加密密钥，这意味着 Chrome 的数据现在可以免受攻击者的侵害。
ini 复制代码 
"C:\Program Files\Google\Chrome\Application\chrome.exe" --remote-debugging-port=9222 --user-data-dir="%TEMP%\chrome-profile-stable"

  1. 测试一下
    输入如下的prompt提示词，就会在我使用上面命令启动的Chrome实例上运行内容，而不是又独自打开一个新的Chrome实例运行。只需要在第二步打开的Chrome实例登录保存用户即可

    打开github找到chrome-devtools-mcp项目，给他点个star

让opencode结合chrome的面板帮我分析一下我的next.js代码哪里有错，如下是我的源代码 给opencode提供prompt提示词如下

bash 复制代码 
http://localhost:3000/请结合chrome的面板，分析一下为什么我点击"测试一下"按钮，会报错，在控制台并没有打印出"我是测试按钮"

opencode会找到对应的错误，并且给出修复建议

我们给opencode配置了Chrome Devtools Mcp后，不再需要我们手动复制Chrome控制台信息给opencode了，我们也可以通过Chrome Devtools Mcp来实现网站性能/安全分析并且给出对应的修复建议。我们也了解了MCP的配置和用法，针对其他MCP用法也是大同小异就不一一演示了，感兴趣的小伙伴自行查阅对应MCP官网进行配置就可以了

注意事项

当我们使用MCP服务器时，会将该MCP的描述、API能力以系统提示词添加到我们的上下文中。如果我们有很多MCP服务，那么会把所有MCP服务都添加到我们的上下文中。因此我们应该只安装或者开启我们需要的MCP服务从而节省上下文，防止超出上下文限制。在opencode中可以/mcps选择对应的mcp服务器，再通过Space空格键来切换状态

skills

什么是的skills

Agent skills是一种轻量的开放格式，用于通过专业知识和工作流程扩展AI agent的功能。

skill是包含SKILL.md文件的文件夹。该文件包含元数据(name和description)以及告诉Agent如何执行特定任务的说明。SKILLS也可以包含script、references、assets

md 复制代码 
my-skill/
├── SKILL.md          # Required: instructions + metadata
├── scripts/          # Optional: executable code
├── references/       # Optional: documentation
└── assets/           # Optional: templates, resources

为什么需要使用skills

skills是可重用的，基于文件系统资源为AI agent提供特定领域的专业知识。将通用AI agent变为专业的Agent在工作流程、上下文和最佳实践。与prompt不同(一次性任务对话说明)，skills按需加载，无需在多个对话中重复提供相同的指导。

将通用Agent看作为一家饭店，skills在其中就充当菜谱的角色。当你的饭店拥有了菜谱那么这家饭店就具备了那些特色菜，也将菜系作为一个工作流的方式存储下。这样每次顾客点西红柿炒蛋就无需重新学一遍，做出来的口味也会更加统一

主要优点

  • 更专业的Agent(垂直agent): 根据特定领域任务定制功能
  • 减少重复: 一次创建，自动使用
  • 组合功能: 组合skills去构建复杂的工作流程

使用skills

skills在代码执行环境中运行，AI Agent拥有文件系统访问权限、bash命令和代码执行能力。

接下来演示一下find skills和create skills,因为这两个skill比较常用和通用。我们可以在skills市场搜索开源skills使用，也可以自定义我们自己的skills。

find skills

这个skills可以帮助我们从开放Agent skills生态系统中发现并且安装skill

从skills.sh找到其使用方法和skills功能说明 在终端执行如下命令进行find-skills进行安装

csharp 复制代码 
npx skills add https://github.com/vercel-labs/skills --skill find-skills

重启opencode输入/skills即可查看已经安装skills 接下来来看一下find-skillls的SKILL.md文件。一个skill文件一般包含了使用场景(description)、触发条件、具体的workflow、可能的script\reference\assets、具体实例、错误处理等等。(对于使用者来说只了解该skills是解决什么问题以及如何通过prompt触发它即可)

  • description用于声明这个skills的职责是什么(清晰+简短)
  • When to Use This Skill声明了何时触发这个skill(用户询问如何完成某件事情，其中这件事情是一项常规任务且已掌握相关技能。询问可以完成某件事情的skill等等...)

了解了find-skills的触发条件之。下面我们来测试一下，输入下面的prompt，opencode会自动使用find-skills提供的npx skills find去查找是否存在符合要求的skills

复制代码 
我想在想要创建创建一个skills，有没有对应的skills帮助我实现这个操作
skill creator

一般情况下每个公司每到年底都需要年终述职，那是不是也可以自定义一个skills来帮我们生成一个关于年终述职的PPT呢？ 对于书写自定义skills我们可以通过skill-creator这个skills帮我创建。接下来通过skill-creator来创建一个关于年终述职PPT的skills

ts 复制代码 
帮我生成一个提示词，用于实现年终总结PPT的skills实现的提示，我会把这个提示词喂给skill-creator来创建我的自定义skills

skill-creator也提供了一个python脚本用于打包分享给其他opencode用户 通过该skills帮我生成了一个ppt现在有点丑。因为只是演示关系我就不再优化skills提示词了，例如我们可以优化使用Office-PowerPoint-MCP-Server来使用ppt操作，而不是通过python脚本直接生成。追加更多与用户交互的提示词(让用户提供更多的信息、以及年终数据...)等等。（发挥你的想象力，去创建使用好玩的skills，分享在skills.sh也是ok的）

让你的skills更加专业

skill文件一般包含了使用场景(description)、触发条件、具体的workflow、可能的script\reference\assets、具体实例、错误处理等等，如何写好skills呢？ 如下有三个建议:

1. 功能职责单一化

一个专业的skill首先要有清晰的职责范围，不要试图让一个skill做太多的事情，专注于解决一个具体的问题会更好。例如: 文件整理就文件整理，不要又涉及分析文件内容。这样让skill变得复杂且难以维护

2. 渐进式批漏

不要一次性把所有内容塞给AI agent，而是根据需要逐步获取信息。因为模型的上下文窗口是有限制的，而skill本质也是prompt提示词给到AI agent，全部加载进来的话会占用大量的上下文空间。渐进式纰漏就是让skill先加载目录(文件名称、description描述)，只有确定需要使用某个skill才加载其的详细内容。我们一般将skill的详细文档、示例代码、参考资料放到单独的文件，然后再SKILL.md通过链接的形式进行关联。

就像维基百科一样: 从一个目录开始，仅在必要时才会引用越来越深的片段

3. description清晰度

如下SKILL.md可以使用，但是给出的信息太少，AI agent不知道这个skill是干什么的

md 复制代码 
name: file-rename  
description: 重命名文件  
# 文件重命名  
  
xxxxxxx

改进之后,description提供了更多信息，让AI agent能够更加准确理解这个SKILL的用途和方法

md 复制代码 
name: file-rename  
description: 批量重命名文件,支持按规则添加前缀、后缀、序号等。当用户需要批量修改文件名、统一文件命名格式时使用。  
# 文件批量重命名工具  
  
xxxxx

同时也可以参考一些优秀的开源skills写法，例如: 如何写出好的 Skill？拆解 skill-creator 背后的设计

skills如何工作

这里不再概述了claude code写的非常清晰了。这个Claude Code Skills & skills.sh - Crash Course来自于Youtube的视频讲skills也非常清晰

推荐skills

superpowers是一个完整的软件开发工作流程，适用于您的编码代理。它基于一组可组合的"skills"和一些初始指令构建而成，确保您的代理能够使用这些技能。让coding agent更加规范的编写代码，避免屎山代码

superpowers基本工作流 （让AI agent执行更加规范、系统化）

安装完成superpowersskills集合后，其包含了brainstormin头脑风暴将你的粗略想法(想做一个需求，但是细节并没有想明白)输出为设计文档、writing-plans根据设计文档来生成执行计划、然后execute-plan来执行和实施计划等等工作流。 针对opencode可给定superpowers工作流需要执行哪些步骤，你可以通过/brainstormin、/write-plan、/execute-plan这个命令来执行。

ts 复制代码 
从 https://github.com/obra/superpowers 学学 superpowers 怎么用，
当我提到"使用 superpowers 工作流"时，按这个顺序来：
1）先头脑风暴（brainstorm）
2）再写计划（write-plan）
3）最后按计划实现和测试（execute-plan）

上面提到的/brainstormin、/write-plan、/execute-plan这三步也是最核心步骤

  1. /brainstormin明确需求确定需要做什么
  2. /write-plan 写个执行计划
  3. /execute-plan按照执行计划一步一步执行

先通过brainstormin生成主题设计文档，然后通过write-plan拆分主题设计文档生成主题执行计划，然后再调用execute-plan执行任务。
最终效果如下

AGENTS.md、rules、mcp、skills的关系

总结

经过前面步骤，我们学会了opencode的基础操作，以及涉及了Agent.md、Rules、Mcps以及skills的使用，由于这篇幅比较长了。关于open routes、多Agents协作、抓取Agent请求分析MCP\SKILLS交互原理、模型对比选择等放到之后有时间再整理

参考资料

agents
AGENTS.md Guide
A Complete Guide To AGENTS.md
AGENTS.md、层级规则与可选的 AGENTS.override.md
Rules & Guidelines
Agent Skills、Rules、Prompt、MCP，一文把它们理清楚了
Cursor Rules
opencode-rules
MCP Explained: The New Standard Connecting AI to Everything
chrome-devtools-mcp
Claude Code Skills 上手指南：从概念到真正用起来
Agent Skills Claude Code Skills & skills.sh - Crash Course
Introducing Agent Skills
Superpowers-入门快速指南 从"代码搬砖工"到"AI 团队主管"：OpenCode + Oh My OpenCode 开启多智能体协作新纪元

相关推荐
默默学前端5 小时前
ES6模板语法与字符串处理详解
前端·ecmascript·es6
lxh01135 小时前
记忆函数 II 题解
前端·javascript
我不吃饼干5 小时前
TypeScript 类型体操练习笔记（三）
前端·typescript
华仔啊5 小时前
除了防抖和节流，还有哪些 JS 性能优化手段？
前端·javascript·vue.js
CHU7290356 小时前
随时随地学新知——线上网课教学小程序前端功能详解
前端·小程序
清粥油条可乐炸鸡6 小时前
motion入门教程
前端·css·react.js
这是个栗子6 小时前
【Vue3项目】电商前台项目（四）
前端·vue.js·pinia·表单校验·面包屑导航
前端Hardy6 小时前
Electrobun 正式登场：仅 12MB，JS 桌面开发迎来轻量化新方案！
前端·javascript·electron
树上有只程序猿6 小时前
新世界的入场券，不再只发给程序员
前端·人工智能
confiself6 小时前
deer-flow前端分析
前端
热门推荐
01GitHub 镜像站点02Qwen3.5 开源全解析：从 0.8B 到 397B，代际升级 + 全场景选型指南03OpenClaw 使用和管理 MCP 完全指南04UV安装并设置国内源05OpenClaw Control UI安全上下文访问配置06OpenClaw macOS 完整安装与本地模型配置教程（实战版）07Claude Code + GLM4.7 避坑指南：解决 Unable to connect to Anthropic services08本地部署 OpenClaw + DeepSeek-R1 完全指南09小黑课堂计算机二级WPSoffice题库软件下载安装教程（2026年3月最新版）10AI 编程三剑客：Spec-Kit、OpenSpec、Superpowers 深度对比与实战指南