AI编程

TODO

技能

技能和 Agent 交互?

Agent分析
↓
Skill A 启动 → suspend（状态1）
↓
Agent (<-> 用户) 多轮交互
↓
Skill A resume（状态1）→ 继续执行 → suspend（状态2）
↓
Agent 再交互
↓
Skill A resume（状态2）
↓
最终处理 → finish

Vibe-Coding

easy-vibe

AI编程工具介绍

端到端模式
- Claude Code 常用终端(也支持桌面), 系统级Agent
IDE(协作模式)
- Trea: 字节
- Antigravity IDE, Google
  - Gemini3
  - API Keys
- Cursor 类似Trae
- OpenCode
- Windsurf
- Kiro 亚马逊
- GitHub Copilot 终端
API类
- 智谱LM 4.7
- Kimi K2
原型工具
- V0: 生成简单原型界面
设计图工具
- Stitch: Google, 原型生成
- Figma Make
流程图设置
- 基于draw.io的AI流程图插件: 在线使用

AI编程工具

Claude-Code

Claude Code 官方文档
- 命令行安装参考下文
- 官方桌面端(可配合 cc-switch 切换模型使用): https://code.claude.com/docs/en/desktop-quickstart
- WEB版使用
- 第三方CC-GUI(类似 Codex 界面): https://github.com/zhukunpenglinyutong/desktop-cc-gui
Claude Code 实践
相关工具
- cc-switch 切换不同模型

命令行安装

参考: https://docs.bigmodel.cn/cn/coding-plan/tool/claude

# mac安装. windows ps安装: `irm https://claude.ai/install.ps1 | iex`
# (不推荐) 或使用 npm 全局安装 Claude Code, 依赖 Node.js 18+. npm install -g @anthropic-ai/claude-code
curl -fsSL https://claude.ai/install.sh | bash

# (推荐) 使用 cc-switch 工具切换不同模型. 切换模型后 ~/.claude/settings.json 文件也会被此插件接管. 可设置通用配置和每个模型自己的配置
# 设置: 勾选"跳过 Claude Code 初次安装确认"
https://github.com/farion1231/cc-switch

# 验证安装是否成功. 2.1.7 (Claude Code)
# claude update # 更新到最新版本
# 配置文件在 ~/.claude 目录
claude --version
/login # 登录账户

# 进入文件夹后只需命令即可启动. 上下文会限制在这个目录
cd xxx # 进入某个文件夹作为工作空间, 不要在家目录执行
claude # 启动 Claude Code 会话, 会话会限制在这个目录下
# claude --dangerously-skip-permissions # 危险模式. 跳过一切确认完全授权执行


## 常用命令: https://code.claude.com/docs/zh-CN/cli-reference
# 基础操作
claude                    # 启动 Claude Code 会话
    claude --dangerously-skip-permissions # 危险模式. 跳过一切确认完全授权执行
claude --version          # 查看版本
claude -p "prompt"        # Headless 模式(非交互式)，可集成到 Shell 脚本或 CI/CD 流程中. eg: git diff | claude -p "解释这些更改"
    claude -p --output-format json # 结构化输出，便于脚本消费
    claude -p --output-format stream-json # 实时 JSON 事件流，适合长任务监控、增量处理、流式集成到自己的工具
claude --continue               # 恢复当前目录最近会话，隔天接着做
    claude --continue --fork    # 从已有会话分叉，同一起点不同方案
claude --resume                 # 打开选择器恢复历史会话

# 斜杠命令
/clear                    # 清空对话
/compact                  # 压缩对话
/plan	                  # 生成项目计划
/init	                  # 初始化 Claude.md 文件
/add-dir <路径>	           # 添加更多工作目录到上下文
/export conversation-260106.json # 导出当前会话的 JSON 格式记录
/context                  # 查看上下文
/cost                     # 查看费用
/model                    # 切换模型
/mcp                      # 管理 MCP
/skills                   # 查看 Skills
/hooks                    # 管理 Hooks
/agents                   # 管理子代理
/status                   # 系统状态
/doctor                   # 诊断环境
/help                     # 查看帮助
# 其他命令
/memory                   # 查看内存使用情况
/permissions              # 查看或更新权限白名单
/sandbox                  # 配置沙箱隔离，高自动化场景必备
/rewind                   # 不是”撤销”，而是回到某个会话 checkpoint 重新总结对话; 想保留前半段共识但丢掉后半段失败

# 快捷键
Ctrl+R                    # 搜索历史
Ctrl+S                    # 暂存提示词
Ctrl+C                    # 中止操作
Shift+Tab × 2             # Plan 模式
ESC ESC                   # 回溯，可以回到上一条输入重新编辑，不用重新手打
Alt+V                     # 粘贴图片

# 文件操作
@file.ts                  # 引用文件
@src/                     # 引用目录
!command                  # 执行 Bash 命令. Ctrl+o 切换显隐全部内容. eg: !ls


## 安装MCP. 常用如: Chrome DevTools (从而可操控浏览器)
claude mcp add chrome-devtools npx chrome-devtools-mcp@latest
claude mcp list # 命令行查看; claude 中查看: /mcp
claude mcp remove chrome-devtools # 移除已安装的 MCP 服务器

配置说明

配置文件~/.claude.json
配置目录~/.claude，目录下包括
- settings.json 参考下文
- projects 文件夹名按项目路径命名（斜杠变横杠），每个会话是一个 .jsonl 文件
~/.claude/settings.json <== 项目目录 .claude/settings.json 或 .claude/settings.local.json

{
    "env": {
        "ANTHROPIC_BASE_URL": "https://api.moonshot.cn/anthropic",
        "ANTHROPIC_AUTH_TOKEN": "sk-xxxx",
        "ANTHROPIC_MODEL": "kimi-k2.5",
        "ANTHROPIC_REASONING_MODEL": "kimi-k2.5",
        "ANTHROPIC_DEFAULT_HAIKU_MODEL": "kimi-k2.5",
        "ANTHROPIC_DEFAULT_OPUS_MODEL": "kimi-k2.5",
        "ANTHROPIC_DEFAULT_SONNET_MODEL": "kimi-k2.5",
        "API_TIMEOUT_MS": "3000000",
        "CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC": 1
    },

    // 权限. 禁用 WebSearch 功能. 或者使用 Brave<brave.com> 的 MCP 服务
    // "permissions": { "deny":[ "WebSearch" ] },

    // 禁用 WebFetch 工具前置的风控检查 (anthropic.com 会拒绝所有来自中国大陆、香港的请求)
    "skipWebFetchPreflight": true,

    // 基于插件显示状态栏 https://github.com/Wangnov/claude-code-statusline-pro
    "statusLine": {
        "command": "npx ccsp@latest --preset PMBTUS --force-emoji",
        "type": "command"
    }
}

CLAUDE.md文件

当前对话提示 > Instructions for Claude(貌似没生效) > demo/CLAUDE.md > CLAUDE.md > ~/.claude/CLAUDE.md
实用技巧与误区
- 建议大小 10K - 20K
- 应该很短：只在 Claude 容易出错的地方加说明，别想着写完整手册
- 别用 @ 引用文档：正确做法是推销这个文件，告诉它为什么和何时该读。例如：遇到复杂用法或 FooBarError 错误时，参考 path/to/docs.md 的高级故障排除
- 别只说禁止：不要写纯否定约束，比如永远不要用某个标志。智能体真需要这个标志时就傻了。永远提供替代方案
- 把 CLAUDE.md 当倒逼函数：对于复杂的工作应该写个简洁的 Bash 包装脚本，提供清晰的 API，然后只给包装脚本写文档
~/.claude/CLAUDE.md 全局配置文件案例

# Global Rules

- 始终使用简体中文回答用户。
	- 思考、计划、总结、标题归纳、任务说明、变更说明全部使用简体中文。
	- 不要使用英文作为会话标题、摘要标题、TODO 标题，除非是代码、命令、文件名、类名、方法名、日志原文或专有名词。
	- 如果用户没有明确要求英文，默认所有自然语言输出为中文。
- 如果项目中只有 AGENTS.md 没有 CLAUDE.md 文件，则将 AGENTS.md 当成 CLAUDE.md 规范文件

实践技巧

/context 建议编码时至少运行一次，看看 200k 个 token 的上下文窗口用了多少
/compact 压缩上下文。尽量别用，自动压缩不透明、容易出错、优化不好
- 简单重启会话用 /clear 清除上下文，然后通过快捷命令让 Claude 读取 git 变更记录
- 复杂任务让 Claude 把计划和进度写进 .md 文件，/clear 清状态，然后新会话读取 .md 继续干
自定义子智能体存在问题：隔离上下文
- 应该把上下文给主智能体（通过 CLAUDE.md），让它用 Task/Explore(…) 自己管理任务分配
claude --resume 和 claude --continue 重启会话
技能（Skills）可能比 MCP 更重要
- MCP 应该是管理认证、网络和安全边界，然后退居幕后。它为智能体提供入口点，智能体随后用脚本和 markdown 上下文执行实际工作
对话前加ultrathink: 开启深度思考模式(Claude 会分配高达 32k 的 Token 进行内部推理)
本地与云端同步开发(貌似要 pro 用户)

# 在 claude.ai/code 网页端运行几个会话
# 利用 & 命令将本地会话"甩"给网页端后台运行
& 将这个任务转到网页端继续

# 在网页版开始新任务
# 然后在终端用 claude --teleport session_id 拉回本地

钩子

Codex

AGENTS.md 和 ~/.agents
~/.codex 为 Codex App 的配置目录，项目目录也可放置(如~/.codex/skills只对该项目生效)
Codex CLI
- 使用$展示和使用技能, 或者使用/skills列举后选择技能

Trea

项目开发基础模块: 登录登基础页面, 统一日志, 统一提示, 统一异常, 多语言, 日期, 币制, 主题
MCP配置
- Figma: 支持基于个人 Token 进行调用, 对话时提供项目链接即可
- Firebase
Skills技能: 新版本内置技能设置; 也可参考上文手动触发
SOLO工作模式
- Agent: 默认模式; 适合日常开发任务、快速解决问题
- Plan(对话前加/plan触发): 先制定计划, 确认后执行; 适合复杂任务
- Spec(对话前加/spec触发): 先制定详细的规格(spec.md、tasks.md、checklist.md), 再确认(可多轮对话反复修改此 spec 文件), 后执行(按上述规范文件执行); 适合大型功能开发
SOP

1
2
3

# Codex: 你写好规格文档和开发计划我会丢给 Trae 开发. 你还需要写好验证事项, 比如功能是否完整/功能是否正确/页面是否美观/是否遵循项目代码开发原则等
# Trae: 这是产品需求：xxx.md 这是实现计划：xxx.md 请严格按照需求和实现计划完成开发 (基于 worktree 修改)
# DeepSeek: 这是产品需求：xxx.md 这是实现计划：xxx.md 当前开发已经完成，但尚未提交。请作为代码 Reviewer 和 QA 进行严格验收

Antigravity

文档
- 官方文档: https://antigravity.google/docs
- 系统提示词说明: https://liduos.com/google-antigravity-system-prompts.html
科学使用
- TUN模式
- 或者Proxifier代理: "Antigravity.app"; "Antigravity"; "Antigravity Helper"; "language_server_macos_arm"; com.google.antigravity; com.google.antigravity.helper 注意 language_server_macos_arm 这个服务, 不同 CPU 可能是 language_server_macos_x64
MCP配置(AI对话框右上角3个点进入)
- 自定义 MCP 配置: AI对话框右上角3个点进入 - Manage MCP Servers - View raw config
- Figma
  - 官方提供的 MCP 只能基于 Figma 桌面端的 Dev Mode MCP Server 功能实现(需要 Figma Pro 账户)
  - 可使用 https://github.com/GLips/Figma-Context-MCP 进行自定义

HarnessEngineering驾驭工程

OpenSpec 面向 AI 辅助工作流的规范驱动开发技术白皮书
- openspec-cn
superpowers: 执行层、工作流、TDD、代码质量
- superpowers-zh
gstack: 管理层、角色团队、全流程、产品交付
- 内置 browser
Get-Shit-Done: 中间层、上下文、Spec 驱动、防腐烂
everything-claude-code 一套可复用的 Claude Code 工程开发工作流组件库

superpowers-zh

技能基本都是 MD 文件(非常少的脚本文件)
安装

## 下载到本地
git clone https://github.com/jnMetaCode/superpowers-zh.git ~/.superpowers-zh/

## 安装到目录(用户 .claude 目录或项目 .claude 目录)
# 进入项目目录执行后安装到项目目录. 需要提前创建好 .claude / .codex / .trae 等文件夹
# npx superpowers-zh
mkdir -p .codex/skills/ && ln -s ~/.superpowers-zh/skills/* .codex/skills/

技能说明

Skill	说明	触发条件
using-superpowers	指南	在开始任何对话时使用——确立如何查找和使用技能，要求在任何响应（包括澄清性问题）之前调用 Skill 工具
brainstorming	头脑风暴	在任何创造性工作之前必须使用此技能——创建功能、构建组件、添加功能或修改行为。在实现之前先探索用户意图、需求和设计。
writing-plans	编写实现计划	当你有规格说明或需求用于多步骤任务时使用，在动手写代码之前
executing-plans	执行实现计划	当你有一份书面实现计划需要在单独的会话中执行，并设有审查检查点时使用
test-driven-development	TDD(测试驱动)	在实现任何功能或修复 bug 时使用，在编写实现代码之前
systematic-debugging	系统化调试方法	遇到任何 bug、测试失败或异常行为时使用，在提出修复方案之前执行
requesting-code-review	请求代码审查	完成任务、实现重要功能或合并前使用，用于验证工作成果是否符合要求
receiving-code-review	处理代码审查反馈	收到代码审查反馈后、实施建议之前使用，尤其当反馈不明确或技术上有疑问时——需要技术严谨性和验证，而非敷衍附和或盲目执行
verification-before-completion	完成前验证检查	在宣称工作完成、已修复或测试通过之前使用，在提交或创建 PR 之前——必须运行验证命令并确认输出后才能声称成功；始终用证据支撑断言
finishing-a-development-branch	开发分支收尾决策	当实现完成、所有测试通过、需要决定如何集成工作时使用——通过提供合并、PR 或清理等结构化选项来引导开发工作的收尾
subagent-driven-development	子代理驱动开发模式	当在当前会话中执行包含独立任务的实现计划时使用
dispatching-parallel-agents	并行代理任务调度	当面对 2 个以上可以独立进行、无共享状态或顺序依赖的任务时使用
using-git-worktrees	Git 工作树隔离管理	当需要开始与当前工作区隔离的功能开发或执行实现计划之前使用——创建具有智能目录选择和安全验证的隔离 git 工作树
workflow-runner	YAML 工作流执行引擎	在 Claude Code / OpenClaw / Cursor 中直接运行 agency-orchestrator YAML 工作流——无需 API key，使用当前会话的 LLM 作为执行引擎。当用户提供 .yaml 工作流文件或要求多角色协作完成任务时触发。
writing-skills	技能编写与验证	当创建新技能、编辑现有技能或在部署前验证技能是否有效时使用
mcp-builder	MCP 服务器构建方法论	MCP 服务器构建方法论 — 系统化构建生产级 MCP 工具，让 AI 助手连接外部能力
chinese-code-review	中文代码审查规范	中文代码审查规范——在保持专业严谨的同时，用符合国内团队文化的方式给出有效反馈
chinese-commit-conventions	中文提交规范	中文 Git 提交规范 — 适配国内团队的 commit message 规范和 changelog 自动化
chinese-documentation	中文文档写作规范	中文技术文档写作规范——排版、术语、结构一步到位，告别机翻味
chinese-git-workflow	中文 Git 工作流规范	适配国内 Git 平台和团队习惯的工作流规范——Gitee、Coding、极狐 GitLab 全覆盖

gstack

技能 MD 文件里面包含一些脚本案例, 有些技能比如 browse 还包含了很多 TS 脚本
安装(需先安装 bun)

## claude code 安装
# 个人安装
# ./setup --prefix # 基于前缀安装, 如果加了则技能名称如 /gstack-browse
git clone https://github.com/garrytan/gstack.git ~/.claude/skills/gstack && cd ~/.claude/skills/gstack && ./setup
# 项目安装
cp -Rf ~/.claude/skills/gstack .claude/skills/gstack && rm -rf .claude/skills/gstack/.git && cd .claude/skills/gstack && ./setup

技能
- 产品规划
  - /office-hours YC合伙人模式: 提需求后，他会追问用户是谁, 核心价值是什么等等
  - /plan-ceo-review 创始人模式：重新思考问题，寻找10星级产品
- 技术设计
  - /plan-eng-review 工程经理模式：锁定架构、数据流、图表、边缘情况, 生成 DESIGN.md 文件
  - /plan-design-review 设计师模式：视觉一致性、用户体验
- 开发阶段
  - /autoplan 自动计划模式：根据用户需求，自动生成实现计划
  - /careful 谨慎模式：关注细节，避免错误
- 代码质量
  - /review 资深工程师模式：偏执代码审查，发现生产级bug
  - /cso 安全审计模式：检查代码是否符合安全规范
- 浏览器自动化
  - /browse QA工程师模式：浏览器自动化，为AI提供眼睛
  - /qa QA负责人模式：系统化测试，健康评分，回归检测
- 发布上线
  - /ship 发布工程师模式：检查代码，跑测试，生成提交信息
  - /land-and-deploy 相当于 Release Engineer
- 文档
  - /document-generate 生成项目文档
  - /document-release 技术文档模式：自动更新项目文档
- 其他
  - /retro 工程经理模式：团队感知回顾，数据驱动分析
  - /setup-browser-cookies 会话管理器：从真实浏览器导入cookie
  - /qa-only QA报告模式：纯粹bug报告，无代码更改
browse 原理
- 底层就是 Playwright，但接口面向 agent 重新封装了，核心架构（3 层）
- 节点定位：基于无障碍树（AT），不是 DOM 树，参考源码: snapshot.ts

┌─────────────────────────────────────────────────┐
│ Layer 3: Agent CLI                              │  ← agent / 人 调用
│   $B click @e3                                  │
│   $B fill @e2 "test"                            │
└──────────────┬──────────────────────────────────┘
               │ HTTP POST /command
┌──────────────▼──────────────────────────────────┐
│ Layer 2: Daemon (Bun + Playwright)              │  ← 长跑进程
│   - 维护 BrowserContext / Page                  │
│   - 维护 Map<"@e3", Playwright.Locator>         │
│   - 命令路由：click/fill/snapshot/...           │
└──────────────┬──────────────────────────────────┘
               │ Playwright API (CDP under the hood)
┌──────────────▼──────────────────────────────────┐
│ Layer 1: Chromium                               │
│   - 真实页面，真实事件                            │
└─────────────────────────────────────────────────┘

Claw

HermesAgent‌

github

OpenClaw小龙虾

官网, 文档, github
ClawHub OpenClaw 的官方技能注册平台
- 技能推荐: https://github.com/VoltAgent/awesome-openclaw-skills
安装及命令
- 参考: https://cloud.tencent.com/developer/article/2626160
- 或基于阿里云镜像服务器: https://www.aliyun.com/activity/ecs/clawdbot
- 模型选择
  - 使用 Qwen 进行页面认证后有一定的免费额度
  - 使用自定义模型配置阿里百炼API, 参考: https://help.aliyun.com/zh/model-studio/openclaw

# 或者使用curl安装: curl -fsSL https://openclaw.ai/install.sh | bash
# NodeJS 安装: https://nodejs.org/en/download
# 安装/更新openclaw
npm install -g openclaw@latest
# 初始化openclaw (之后会随电脑自动启动)
# 配置文件在 ~/.openclaw/openclaw.json
# 自己安装的插件在 ~/.openclaw/extensions/ 目录
# 工作空间在 ~/.openclaw/workspace/ 目录
openclaw onboard --install-daemon
# 启动网关
openclaw gateway run
openclaw gateway restart # 重启网关

## 其他命令
openclaw status # 查看状态
openclaw logs --follow # 查看日志
openclaw tui # 打开命令行UI对话界面

内网访问/宿主机访问: https://blog.csdn.net/weixin_43248394/article/details/159504854
不支持代理访问(web_fetch), 参考: https://github.com/openclaw/openclaw/issues/27597
- 基于安全考虑，OpenClaw 不支持 SSRF 访问 (不允许直接访问内网, 否则可能读取到内网敏感信息)

消息渠道

微信: 微信插件
飞书: https://docs.openclaw.ai/zh-CN/channels/feishu
- 安装飞书openclaw/feishu插件报错spawn EINVAL 解决后可以把全局openclaw包下的extensions/feishu文件夹删掉
- 配置飞书渠道
  - 创建飞书应用 - 添加机器人能力 - 权限管理中添加im:*和contact:contact.base:readonly - 发布飞书应用 - 在OpenClaw中配置此 Channel 的 App ID/Secret - 重启Gateway - 飞书后台配置事件订阅 - 订阅方式: 使用长连接接收事件 - 添加事件: im.message.receive_v1 - 重新发布飞书应用 (顺序很重要)
- 如果是首次私聊飞书机器人，可能会回复一个配对码。此时需要在服务器上执行 openclaw pairing approve feishu <配对码> 完成授权
  - 没有测试成功，可以将模式改为allowlist私聊白名单，如"channels": { "feishu": { "dmPolicy": "allowlist", "allowFrom": ["ou_1a4bfd418ae7bf556b42589d28e05586"] } }
- 私聊定时任务没测通过，群组的定时任务可以

创建多个 Agent

# 查看所有 Agent. 默认的为 main
openclaw agents list

# 创建新 Agent
openclaw agents add operation --workspace ~/.openclaw/workspace-operation
# 为每个 Agent 配置飞书渠道后重启: openclaw.json
{
  "channels": {
    "feishu": {
      "enabled": true,
      "domain": "feishu",
      "groupPolicy": "open", // 注意：生产环境建议改为 "allowlist" 以提高安全性
      "accounts": {
        "main": {
          "appId": "cli_a91be1951578dcca",
          "appSecret": "你的主应用Secret",
          "botName": "小虾米"
        },
        "operation": {
          "appId": "cli_a910c62c59b8dcb5",
          "appSecret": "你的新应用Secret",
          "botName": "运营虾"
        }
      }
    }
  },
  "bindings": [
    {
      "agentId": "main",
      "match": {
        "channel": "feishu",
        "accountId": "main"
      }
    },
    {
      "agentId": "operation",
      "match": {
        "channel": "feishu",
        "accountId": "operation"
      }
    }
  ]
}

搜索

搜索方案
- Tavily: 免费额度, 日常够用
- DuckDuckGo: 免费, 科学上网
- SearXNG: 自建开源聚合搜索引擎(可Docker部署), 隐私高, 免费, 科学上网

Better Code, Better Life

TODO

Vibe-Coding

AI编程工具介绍

相关概念协议

MCP

Skills

Skills收集分类

AI编程工具

Claude-Code

命令行安装

配置说明

CLAUDE.md文件

实践技巧

钩子

Codex

Trea

Antigravity

HarnessEngineering驾驭工程

superpowers-zh

gstack

Claw

HermesAgent‌

OpenClaw小龙虾

消息渠道

创建多个 Agent

搜索