AI-IDE, LLM-based (inc. MCP), Integrated Development Environment, ClaudeCode, Codex, Opencode

AI-IDE, LLM-based (inc. MCP), Integrated Development Environment, ClaudeCode, Codex, Opencode

2026-02-23. Category & Tags: AIGC, GPT, LLM, Large-Language-Model, 大语言模型, AI-IDE

计算机辅助编程发展路径 #

-> Tab Coding
-> Vibe Coding (氛围编程) ->
-> Spec-Driven Coding, Specification-Driven Development, SDD (e.g. OpenSpec)
- (Kiro 发起,国内唯一无门槛调用 Claude 的 IDE) (含：产品需求、技术设计、任务清单 Tasks)
-> TDD AI Coding (Sunny 补充最后一个)

AI 之间的通信？发展路径 #

-> Agent workflow with Function Calling / Tool Calling
- e.g. functions/tools defined in system_prompt
- exchange in JSON (build and send a json and receive a json )
- usually local functions
- incompatibility: vendors define their own APIs and functions, e.g. OpenAI uses a tools parameter, Claude uses a tool_use field.
-> MCP (Model Context Protocol) 2024-10-07
- JSON-RPC 2.0 standard
- “standardized version of Function Calling”
- 1 MCP server can contain 1~n tools, all the tools of all the connected MCP servers are presented to LLM at the same time (e.g. old Function Call info, or System Prompt), the LLM decides when to use
- cons: LLM generate special tokens to use tools, which must be trained; too many tools for LLM to understand and choose (经常几百~上千)
-> A2A 2025-04-09
- an open standard protocol enabling AI agents across different platforms and frameworks to communicate
- uses existing standards, e.g. HTTP, Server-Sent Events (SSE), JSON-RPC
-> MCP Code Mode 2025-09-26
- LLM is good at coding a script to use APIs (LLM 见过太多) than special-token-surrounded-json-chunk within nature-language (之前没有的新东西)
- “1 tool (can call anyone of all the APIs)” which is writen by the LLM in TypeScript, LLM run TypeScript against an API (isolated JavaScript runtimes by V8 engine, in a dynamic sandbox, output by console.log(). returns to LLM )

ref

SDD Specification-Driven Development #

ps: OpenSpec is proposed by Amazon Kiro, but no standard format accepted widely, then the ClaudeCode plugin superpowers come out which becomes the de-facto standard that uses SDD.

ref

麦肯锡：AI 时代，旧的敏捷开发方式正在拖累个人效率【！！！非常重要！！，全文观看！】
Claude code 原理拆解：Bash就是一切 by afumubit/白白说大模型，shareAI-lab/learn-claude-code
AI 超元域开发者福音！现有项目用AI迭代？OpenSpec规范驱动开发！让AI按规范写代码，真正做到零失误！
秋芝 2046 轻松学会！高手都在用的AI编程大法！ 2025-12-12

首推！强烈推荐！OPENCODE (CLI, VSCODE PLUGIN) #

详见 /opencode

其他也不错的 IDE，见下方内容。

Debug #

如果需要新版本 nodejs, 例如 v23, 可用 fnm 等虚拟环境进行管理:

curl -fsSL https://fnm.vercel.app/install | bash
bash # or re-login / reload
fnm install 23
fnm use 23
node -v
npm -v

CLAUDECODE (CLI) #

【 WARN ！：Claude 启动时会访问 api.anthropic.com 检测 IP 地区 ！！！ (2026-02) 】

免费教程 #

ClaudeCode 从 0 到 1 全攻略：MCP / SubAgent / Agent Skill / Hook / 图片 / 上下文处理/ 后台任务 ≈ ClaudeCode 视频说明书
菜鸟》ClaudeCode
Claude团队的10个内部技巧
Anthropic 2025-08 (via 吴恩达平台) Claude Code: A Highly Agentic Coding Assistant, by Elie Schoppik：
吃透AI编程Claude code从入门到精通实战教程（进阶版）全程干货 2025-08: 含安装、5 个案例，（bak1,bak2），笔记@掘金

claudecode 常用命令 frequently used commands #

install: #

# nix:
curl -fsSL https://claude.ai/install.sh | bash
# if error, use npm:
# sudo npm install -g @anthropic-ai/claude-code

# win:
irm https://claude.ai/install.ps1 | iex

ref

start: #

若想跳过登录 onboarding，需要设置环境变量，此处以 cc-switch 代理为例。

    "ANTHROPIC_AUTH_TOKEN": "PROXY_MANAGEMED",
    "ANTHROPIC_BASE_URL": "http://127.0.0.1:15721"

由于 Claude 启动时不读取 ~\.claude\settings.json，因此需要在启动前配置环境变量以跳过 ClaudeCode 的 Onboarding / 登录，才便于使用 cc-switch。(配置环境变量前的 CC-switch 的配置见本文 cc-switch 部分。) 也有说可以在 ~\.claude.json 最外层的 JSON object 添加 "hasCompletedOnboarding": true ，未尝试。

# 临时：
$env:ANTHROPIC_AUTH_TOKEN = "PROXY_MANAGED"
$env:ANTHROPIC_BASE_URL = "http://127.0.0.1:15721"

# 永久（也可以用GUI配置用户的环境变量）：
[Environment]::SetEnvironmentVariable("ANTHROPIC_AUTH_TOKEN", "PROXY_MANAGED", "User")
[Environment]::SetEnvironmentVariable("ANTHROPIC_BASE_URL", "http://127.0.0.1:15721", "User")

如果按照以上配置，看到的以下 " 环境变量冲突 " 提示可以忽略：

进入 claude 后常用的 “/” 指令： #

/init # 对当前项目已有的代码生成一个总结 AGENTS.MD，帮助AI快速理解一个项目

# context management
/context # show %
/compact # 压缩之前的对话为摘要，释放上下文窗口
/clear # clear memory (session-wise) every time finishing a task (still exists on disk)
/cost  # token usage and cost (session-wise)
/stats # daily usage, session history, and streaks

# session management
/rename session_new_name
/export my-session-name.md
/resume # 浏览+选定, 可以看到session summar，从而选择session进行恢复
# 或登录时： claude --resume my_session_id ; claude -r …。可从 `~/.claude/history.jsonl` 找到近期所有 prompt 对应的 session id

# some shortcuts
Ctrl+R # Search command history, Tab to accept  
Escape # stop current work if something goes wrong  
Escape * 2 # Rewind

# 使用一段时期后
/insights # 总结个人使用习惯，给出建议

ref: Claude Code’s hidden conversation history (and how to actually use it) | @kentgigger

CC 软件开发流程管理插件推荐 #

Superpowers (新手从这里学习 AI 编程思维和 TDD 思维比较好) #

中配视频教程(英文软字幕无效，双 srt 字幕待上传); 原版英文视频教程纯中文视频教程但是苹果系统，建议回头再看

flowchart TB
A["“Build a dashboard app”"] --> B["**NORMAL CLAUDE**"]
B --> C["Here you go...."]
A --> D["**CLAUDE W/ SUPERPOWERS**"]
D --> E["Brainstorming"]
E --> F["Planning"]
F --> G["Test-Driven Development"]
G --> H["Subagents"]
H --> I["Task 1"]
I --> J["Task 2"]
J --> K["Task 3"]
K --> L["Code Review"]
L --> M["Merge Code"]
M --> N["Git worktree isolation"]
	style D color:#004AAD
	style B color:#737373

Install Superpowers: CC CLI > /plugin > arrows to select “discover” > type to search , enter to install, exit.

Run CC CLI again > /plugin > installed > check / confirm > update etc. Tip: 如果是多功能/多模块并行任务，一般配合 Git worktree。

Usage (e.g. in VSCode Terminal) （注意观察给授权）:

/using-superpowers ：提醒以下 CC，注意用此 plugin。
/sup~:brainstorming ：CC 浏览当前文件夹，问“要做什么？”等等，多轮对话在 ./docs/plans 产出： xxx-design，即 " 设计 “。
头脑风暴最后可能直接调用 write-plan 产出开发计划，并直接询问用哪种方式 execute，默认 sub-agent：
/sup~:write-plan （产出开发计划：implementation-plan）（上一步已自动调用）
/sup~:execute-plan （上一步已调用）ps：自动英文 git commit。
CC 最后一般会给出命令行，可以手动复制粘贴运行，也可以告诉 CC 自己运行，便于 CC 看到命令行输出。

提示：它能看懂 GBK 乱码，因此：乱码可以直接粘贴给它；它觉得没问题的可能给人看就出问题。

其中各 skill （各阶段）的详细讲解，可以看视频，也可以直接问 AI。

Everything ClaudeCode (ECC) #

Get Shit Done (GSD) #

Ralph #

ref

细节配置推荐 #

声音提示 (win) #

ps1: preferredNotifChannel is not working. ps2: 作为最 json 外层的 item。 ps3: beep(频率 Hz, 时间 ms)，这里的双音是模拟 oh-my-opencode 。 ps4: 如有问题，先在 pwsh Terminal 确认 [console]::beep(800,200) 能出声。

{
"preferredNotifChannel": "terminal_bell",
"hooks": {
    "Stop": [
      {
        "hooks": [
          {
            "type": "command",
            "command": "powershell -NoProfile -Command \"[console]::beep(800,200); Start-Sleep -Milliseconds 120; [console]::beep(1000,250)\""
          }
        ]
      }
    ],
    "Notification": [
      {
        "hooks": [
          {
            "type": "command",
            "command": "powershell -NoProfile -Command \"[console]::beep(800,200); Start-Sleep -Milliseconds 120; [console]::beep(1000,250)\""
          }
        ]
      }
    ]
  }
}

web fetch issue #

TODO: Unable to verify if domain wb.beijing.gov.cn is safe to fetch.

其他应用场景 #

CLAUDECODE (VSCODE EXTENSION) #

前提：本地已经安装 CLI 版本，此插件基本就是已经安装的 CLI 的壳。注意：vscode 的配置中，必须使用的是正常可用的（可以是非 A\的 base_url）的配置才能正常启动此插件，否则要求登录，但是启动后，此插件使用的是 ~/.claude/settings.json 配置。即，如果没有 vscode 中的正常可用配置（如下图），此插件会要求登录（即使 ~/.claude/settings.json 配置正常且无变化）。

2026-02-24-13-18-57

CODEX (CLI) #

Install #

npm install -g @openai/codex
codex --version

refs: Codex教程 by packy

启动 #

Tip: Codex 启动时使用 ~\.codex\config.toml, 且不检测 IP 地区？

可配置项目：

model = "gpt-5.4"  
## 开启1M上下文 (如有需要)(消耗*2)  
#model_context_window = 1000000  
#model_auto_compact_token_limit = 900000  
[features]  
##开启多智能体 (如有需要)  
multi_agent = true  
## 开启快速模式 (如有需要)(消耗*2)  
#fast_mode = true

CODEX (APP) #

略。可参考：Codex APP 保姆级使用教程，实战项目全流程讲解，覆盖 Codex APP十一个特性_哔哩哔哩_bilibili：1、基础设置 2、模型选择 3、多项目开发（threads) 4、单项目使用 Worktree 并行开发 5、复杂问题先 plan 6、技能的安装和使用 7、超级简单 GIT 操作 8、自动化 9、语音输入 10、自定义环境命令 11、MCP 安装

CODEX (VSCODE EXTENSION) #

前提：本地已经安装 CLI 版本，此插件就是已经安装的 CLI 的壳。

base_url 和 apikey 会自动从 Codex CLI 的配置（~\.codex\config.toml）获得。

建议配置：“chatgpt.localeOverride”: “zh-CN”

2026-02-24-03-22-53

GEMINI (CLI) #

WARN: 需要全局代理！且速度慢！不建议用！

install & run #

(如果没有全局权限，可以先激活虚拟环境，再执行如下命令，虽然是 -g ，会安装进入虚拟环境的全局。)

提示：如果是在被 Google 排斥的地区，注意代理设置为全局模式才能访问（aistudio.google.com 网页和 CLI 都是），且命令行设置代理，命令行的命令可以从这里复制：，一般格式是：

$env:HTTP_PROXY="http://127.0.0.1:1234"; $env:HTTPS_PROXY="http://127.0.0.1:1234"

正式安装和测试：

# 安装：
npm install -g @google/gemini-cli # 等同于 npm install -g @google/gemini-cli@latest，最新稳定版

# 运行：
gemini
# 或者沙盒运行：
gemini --sandbox -y -p "your prompt here"

第一次运行需要 Google 账号登录或 key。

测试结果，感觉速度很慢，不是网速问题，而是 token 输出直接卡住了：

ref

共性、共通工具、对比 #

前端设计工具 (vibe design) #

在线可用
- V0.dev by Vercel
- Bolt
本地长期用
- Cursor
- WindSurf

ref: 喝着茶把页面写了–掘金等 Google “v0 写前端”; reddit 2025

ai ide 常用的配合工具及其教程 #

此处列出的是不针对特定 IDE 的。

代理工具 #

提供 ClaudeCode、Codex、Genimi、OpenCode IDE 的 LLM API 接口代理，快速切换这几个 CLI IDE 所使用的模型。

OpenCode 建议用 ai-toolbox，包括 oh-my-opencode 等插件配置管理。 cc-switch 用到 OpenCode 的缺点：不从 OpenCode 配置文件读取变化，也不读取现有 provides。 cc-switch 不知道现有 providers，而且文件错误后无法修复。不读 IDE 配置可能的唯一优点：配置文件损坏或丢失不影响 cc-switch 内的配置，但是有 webdav 等备份，不应该将不受 IDE 配置文件反向影响作为优点。

ClaudeCode、Codex、Genimi 应该用 cc-switch。因为 ai-toolbox 写这三个 IDE 配置时，API 调用格式配置有问题 (2026-03)，而且 IDE 配置文件一旦出错，cc-switch 不知道，因为 cc-switch 只重写 “http://127.0.0.1:15721” 背后的配置，但是 IDE 配置已经被 ai-toolbox 改为非 localhost 的。

ai-toolbox #

直接修改 IDE 的配置文件写入具体配置（含 base_url、key），ClaudeCode、Codex、Genimi、OpenCode 都是，其中 OpenCode 是写入所有 providers。

cc-switch #

对 ClaudeCode、Codex、Genimi 是修改 IDE 的配置文件为 cc-switch 自己的 localhost 监听端口，作为 proxy；但 OpenCode 类似 ai-toolbox，不是通过 localhost 代理。

如果 IDE 配置有问题 (例如被 ai-toolbox 等工具修改后)，需要手动修改 base_url 为 “http://127.0.0.1:15721” 。

ps: 此工具的配置默认在 ~/.cc-switch/

claudecode/opencode 典型项目实例（配置、项目结构）对比 #

# ClaudeCode
project/
├── Product-Spec.md                      # 产品需求文档（自动生成）
├── Product-Spec-CHANGELOG.md            # 变更记录（自动生成）
├── UI-Prompts.md                        # 原型图提示词（自动生成）
└── .claude/
    ├── CLAUDE.md                     # !!! 主控配置（必须创建） !!! 位置和名字与 OpenCode 不同！
    └── skills/                          # 技能包（必须创建）
        ├── product-spec-builder/        # 产品经理技能包
        │   ├── SKILL.md
        │   └── templates/
        │       ├── product-spec-template.md
        │       └── changelog-template.md
        ├── ui-prompt-generator/         # UI 提示词设计师技能包
        │   ├── SKILL.md
        │   └── templates/
        │       └── ui-prompt-template.md
        └── dev-builder/                 # 全栈开发工程师技能包
            └── SKILL.md

# OpenCode
project/
├── AGENTS.md                        # !!! 主控配置（必须创建） !!! 位置和名字与 Claude 不同！
├── Product-Spec.md                      # 产品需求文档（自动生成）
├── Product-Spec-CHANGELOG.md            # 变更记录（自动生成）
├── UI-Prompts.md                        # 原型图提示词（自动生成）
└── .opencode/
    └── skills/                          # 技能包（必须创建）
        ├── product-spec-builder/        # 产品经理技能包
        │   ├── SKILL.md
        │   └── templates/
        │       ├── product-spec-template.md
        │       └── changelog-template.md
        ├── ui-prompt-generator/         # UI 提示词设计师技能包
        │   ├── SKILL.md
        │   └── templates/
        │       └── ui-prompt-template.md
        └── dev-builder/                 # 全栈开发工程师技能包
            └── SKILL.md

付费教程：具体内容需要付费 RMB：800/年，见： video: OpenCode 实测｜从零开发一个 AI 应用，能替代 Claude Code 吗？ 2026-01-14 AI 编程 | 产品经理开发技能 3.0 by 废才（bak）

skills/mcps #

MCP Registry: https://registry.modelcontextprotocol.io/?q=context7

code-simplifier: #

ref by AI 全文总结插件：专治AI生成的屎山代码与过度封装 2026-01-10：简化代码逻辑、注释等等。

Install in ClaudeCode : plugin install code-simplifier 评论区建议手动调用即可。

also: https://github.com/Zhen-Bo/pragmatic-clean-code-reviewer

also: 人类的 3 本书： Clean Code, Clean Architecture, The Pragmatic Programmer.

memorix: #

Memorix：跨 Agent 记忆桥 — 让 AI 记住项目的一切，无论新开窗口还是更换编程工具 2026-02, github, 相当于进程间通信（共享内存等等）