> For the complete documentation index, see [llms.txt](https://yeasy.gitbook.io/claude_guide/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://yeasy.gitbook.io/claude_guide/di-san-bu-fen-jin-jie-pian/07_coding/7.4_ide.md).

# 7.4 IDE 集成与工作流

虽然 CLI 很酷，但很多开发任务仍发生在 IDE 中。 将 Claude Code 集成到 VS Code、Cursor、JetBrains 或终端编辑器中，可以把文件选择、diff 审阅、计划确认和会话历史放回日常开发界面。

## 7.4.1 官方 Claude Code IDE 集成

对 VS Code 和兼容 VS Code 扩展生态的编辑器，优先查看官方 Claude Code 扩展。官方文档把它作为在 VS Code 中使用 Claude Code 的推荐方式：它提供图形化会话面板、计划审阅、自动接受编辑、文件和行号选择、会话历史，以及多会话窗口。

官方扩展适合这些场景：

* **代码改动审阅**：在 IDE 内查看 Claude 计划和 diff，再决定是否接受。
* **精确上下文引用**：选中代码或用 `@` 引用文件与行号，减少 Claude 猜测上下文。
* **多会话协作**：把调研、实现、审查拆成不同窗口，避免单个会话上下文膨胀。
* **CLI 兜底**：扩展也包含 CLI；高级场景仍可在集成终端运行 `claude`。

如果你使用 JetBrains 系列 IDE，官方插件会在 IDE 终端中运行 Claude Code，权限模式切换仍遵循 CLI 的 `Shift+Tab` 或 `--permission-mode` 机制。外部终端与 IDE 之间也可以通过 `/ide` 连接，让 Claude 获得当前编辑器上下文。

## 7.4.2 Cursor、Cline 与 Continue

除了官方 Claude Code 集成，Cursor、Cline、Continue 等工具也可以接入 Claude 或其他模型。它们适合已有固定团队工具链、需要多模型切换，或希望保留特定编辑器工作流的团队。

### Cursor

Cursor 是 AI Native IDE 的代表，围绕代码库检索、Composer、多文件 diff 和自动补全构建体验。使用时要注意：Cursor 的能力、模型列表和上下文索引策略属于 Cursor 自身产品能力，不等同于 Claude Code 官方 CLI 或 Agent SDK 的稳定接口。

### Cline

Cline 是一个基于 MCP 理念的 VS Code 插件，专为 Agentic Coding 设计。

* **Visual Evolution**: 它会展示每一步的操作（读取文件 -> 思考 -> 修改文件 -> 运行命令）。
* **Human-in-the-Loop**: 每一次文件写入和命令执行，都需要用户点击批准（也可以设置自动批准）。
* **Token 监控**: 实时显示当前任务消耗了多少 Token 和金额。

### Continue

Continue 是一个开源的 AI 编程助手扩展。

* **多模型切换**: 可以在 Claude Sonnet 5 和 DeepSeek Coder 之间随意切换。
* **自定义 Context Providers**: 支持从 Jira、GitHub Issues 拉取上下文。

## 7.4.3 Zed 与终端编辑器

除了传统 IDE，轻量级编辑器 **Zed** 配合终端工具也是一种高效的 Claude Code 工作方式。Zed 原生支持 MCP 协议，启动速度快，适合需要频繁切换文件的场景。

核心工作模式是 **Zed + Ghostty 分屏协作**：终端（如 Ghostty）占屏幕一半运行 Claude Code，Zed 占另一半打开同一文件。配合 Zed 的自动保存功能（500ms 间隔），Claude Code 编辑文件后变更立即出现在 Zed 中，反过来在 Zed 中手动修改后 Claude Code 也能即时感知。这种模式类似 Google Docs 的实时协作体验，只不过协作方是 AI。

Zed 自动保存配置示例（`Cmd+,` 打开设置）：

```json
{
  "autosave": {
    "after_delay": {
      "milliseconds": 500
    }
  }
}
```

Ghostty 终端支持多窗口和多标签页，适合同时运行多个 Claude Code 并行会话——一个在写计划，一个在执行，一个在调研，一个在修 Bug，互不干扰。

## 7.4.4 工作流最佳实践

有了这些工具，开发工作流发生了什么变化？

### TDD 2.0

1. **Human**: 在 IDE 中创建一个空的测试文件 `test_user_service.py`，写下测试函数名和注释（描述预期行为）。
2. **Claude (Cursor/Cline)**: “看到这个测试文件了吗？请实现它，并编写通过这些测试所需的实现代码。”
3. **Claude**: 自动生成测试代码 body，自动创建 `user_service.py`，自动运行测试。
4. **Human**: 看着绿色的测试通过图标，提交代码。

### 遗留代码考古

面对一个没有任何注释的 5000 行 `Utils.java`。

1. **Human**: 选中代码，`Cmd+L` (Chat)。
2. **Prompt**: “请解释这段代码的逻辑，并为每个公共方法生成 Javadoc。”
3. **Claude**: 生成解释和注释。
4. **Human**: “Apply to file”。瞬间代码变得可读了。

### 结对编程

不要把 Claude 当作搜索引擎，把它当作坐在旁边的同事。

* **Human**: “我觉得这个函数的复杂度太高了，有没有办法优化一下？”
* **Claude**: “我们可以把这部分逻辑提取出来，用策略模式重构...”
* **Human**: “好主意，但这会不会影响性能？”
* **Claude**: “我们可以做个基准测试...”

## 7.4.5 提示词工程在 IDE 中的应用

在 IDE 中，Context 是隐式的。需要学会管理这些 Context，最有效的手段是 **显式化项目知识**。

### 1. `@Files` 引用

显式引用文件比让 AI 猜更准。在 Cursor 或 Cline 中输入 `@` 可以引用文件、文件夹甚至 Git Diff，确保 AI 聚焦于相关代码，而不是产生幻觉。

### 2. `.cursorrules`

这是 Cursor IDE 特有的机制（其他工具也有类似配置文件）。可以在项目根目录放一个 `.cursorrules` 文件。这主要用于 **约束 AI 的行为**。

> “在这个项目中，我们使用 Tailwind CSS。不要使用传统的 CSS 模块。总是优先使用 flexbox。”

### 3. `CLAUDE.md`

这是一个在社区中非常流行的最佳实践（有时也叫 `AI.md` 或 `CONTEXT.md`）。 它不是给人类看的 `README.md`，而是 **专门给 AI 看的项目说明书**。

**为什么需要它？** User 每次开始新会话时，Claude 并不记得项目之前的架构决策、隐含的业务逻辑或特定的构建命令。`CLAUDE.md` 就像是项目的“长期记忆”外挂。

**标准模板示例 (`CLAUDE.md`)**：

```markdown
# Project Context for Claude

## Commands
- Run Server: `npm run dev`
- Run Tests: `npm test`
- Build: `npm run build`
- Database: `npx prisma studio`

## Architecture
- Frontend: React + Vite + Tailwind
- Backend: NestJS (Microservices)
- Data: PostgreSQL + Prisma
- Auth: JWT in http-only cookie

## Coding Standards
1. **Functional Only**: No Class components in React.
2. **Error Handling**: Always use try-catch in async server controllers.
3. **Naming**: Variables use camelCase, database columns use snake_case.

## Common Pitfalls
- When updating user profile, remember to invalidate the redis cache `user:${id}`.
- Do NOT modify `src/legacy/core.js` - it is frozen.
```

**使用技巧**:

* 在 CLI 工具（如 `anthropic-quickstarts` 中的脚本）中，可以配置自动读取此文件。
* 在 IDE 对话开始时，可以直接把这个文件 `@` 进去，让 AI “Read project context first”。

***

工具和环境都准备好了。理论结合实践，下一节将通过几个硬核的实战案例，看看 Agentic Coding 到底能解决多难的问题。

➡️ [自主编码实践与案例](/claude_guide/di-san-bu-fen-jin-jie-pian/07_coding/7.5_practical.md)