<img src="./images/claude-debugs-for-you.png" width="64" height="64" alt="description" align="center"> Claude 帮你调试

又名 Vibe Debugging

使 Claude (或任何其他 LLM) 能够交互式地调试你的代码

这是一个 MCP 服务器和 VS Code 扩展，它使 Claude 能够交互式地调试和评估表达式。

这意味着它也应该与其他模型/客户端等一起工作，但我只在这里用 Claude Desktop 和 Continue 来演示它。

它是语言无关的，假设调试器控制台支持和 VSCode 中调试的有效 launch.json。

开始使用

1. 从 releases 或 VS Code Marketplace 下载扩展
2. 安装扩展

• 如果直接使用 .vsix，请转到 VS Code 中“扩展”中的三个点，然后选择“从 VSIX 安装...”

3. 你将看到一个新的状态菜单项“Claude Debugs For You”，它显示它是否正常运行（勾选）或启动失败（x）

<img width="314" alt="Screenshot 2025-03-22 at 9 51 22 PM" src="https://github.com/user-attachments/assets/2cd65e0d-4c1d-4fb6-b9ea-3995149b4043" />

你可以单击此状态菜单以获取可用命令

<img width="510" alt="Screenshot 2025-03-22 at 9 59 22 PM" src="https://github.com/user-attachments/assets/54e339e3-81f8-4ef2-a201-6742aa2c97a8" />

根据你的设置，按照以下选项之一操作

<details> <summary>如果使用 stdio (经典，Claude Desktop 需要)</summary>

4. 通过搜索 vs code 命令“Copy MCP Debug Server stdio path to clipboard”将 stdio 服务器路径复制到剪贴板

5. 将以下内容粘贴到你的 claude_desktop_config.json 中（但更新为复制的路径！），或者如果你使用其他 MCP 服务器，请进行相应编辑

{
  "mcpServers": {
    "debug": {
      "command": "node",
      "args": [
        "/path/to/mcp-debug.js"
      ]
    }
  }
}

6. 启动 Claude desktop（或其他 MCP 客户端）
   1. 注意：如果它已经在运行，你可能需要重新启动它。
   2. 如果使用 Continue/Cursor 或其他内置于 VS Code 的工具，则可以跳过此步骤 </details>

<details> <summary>如果使用 /sse (例如 Cursor)</summary>

4. 使用“Copy MCP Debug Server sse address to clipboard”命令检索 MCP 服务器 sse 地址
   1. 你可以直接写出服务器 URL "http://localhost:4711/sse"，或者你在设置中设置的任何端口。
5. 根据你的客户端，将其添加到你需要添加的任何位置
   1. 你可能需要点击“刷新”，具体取决于客户端：这是 Cursor 中必需的
6. 启动 MCP 客户端
   1. 注意：如果它已经在运行，你可能需要重新启动它。
   2. 如果使用 Continue/Cursor 或其他内置于 VS Code 的工具，则可以跳过此步骤

</details>

你已准备好调试！

VS Code 调试文档

打开一个包含 .vscode/launch.json 的项目，并将第一个配置设置为使用 ${file} 调试特定文件。

请参阅下面的 运行示例，和/或观看演示视频。

贡献

发现错误或有改进的想法？请打开一个 pull request 或记录一个 issue。

这个 readme 写得很烂吗？帮助我改进它！

演示

使用 Continue

它会找出问题，然后提出一个修复建议，我们只需单击即可应用

https://github.com/user-attachments/assets/3a0a879d-2db7-4a3f-ab43-796c22a0f1ef

<details> <summary>如何使用 Continue 设置？/ 显示 MCP 配置</summary>

阅读文档！

配置：

{
  ...
  "experimental": {
    "modelContextProtocolServers": [
      {
        "transport": {
          "type": "stdio",
          "command": "node",
          "args": [
            "/Users/jason/Library/Application Support/Code/User/globalStorage/jasonmcghee.claude-debugs-for-you/mcp-debug.js"
          ]
        }
      }
    ]
  }
}

你还需要选择一个能够使用工具的模型。

当工具列表弹出时，请确保单击工具列表中的“debug”，并将其设置为“Automatic”。

故障排除

如果你在 continue 中看到 MCP 错误，请尝试禁用/重新启用 continue 插件

</details>

如果对你有帮助，这就是我的配置的样子！但它几乎与 Claude Desktop 相同。

使用 Claude Desktop

在这个例子中，我故意让它非常谨慎（不做任何假设等等 - 与下面的提示相同），但你可以要求它做任何事情。

https://github.com/user-attachments/assets/ef6085f7-11a2-4eea-bb60-b5a54873b5d5

开发

• 使用 VS Code 克隆/打开此 repo
• 运行 npm run install 和 npm run compile
• 点击“运行”，这将打开一个新的 VSCode
• 否则与“开始使用”相同
• 要重新构建，请运行 npm run compile

打包

vsce package

运行示例

在 VS Code 窗口中打开 examples/python

输入提示：

i am building `longest_substring_with_k_distinct` and for some reason it's not working quite right. can you debug it step by step using breakpoints and evaluating expressions to figure out where it goes wrong? make sure to use the debug tool to get access and debug! don't make any guesses as to the problem up front. DEBUG!

翻译：

我正在构建 `longest_substring_with_k_distinct`，但由于某些原因它无法正常工作。 你能使用断点逐步调试并评估表达式，以找出问题所在吗？ 确保使用调试工具来获取访问权限并进行调试！ 不要预先猜测问题。 调试！

其他值得一提的事情

当你启动多个 vs code 窗口时，你将看到一个弹出窗口。 你可以在窗口之间优雅地切换“Claude Debugs For You”。

你也可以禁用自动启动。 然后你只需要单击状态菜单并选择“启动服务器”。

<img width="395" alt="Screenshot 2025-03-22 at 10 08 52 PM" src="https://github.com/user-attachments/assets/2b6d1b61-a2c6-4447-8054-b4dd02a716e8" />

想法简短列表

• [ ] 它应该使用 ripgrep 来查找你所要求的内容，而不是列出文件 + 获取文件内容。
• [x] 添加对条件断点的支持
• [ ] 通过允许 MCP 插入 CodeLens 或“自动修复”建议来添加“修复”工具，以便用户可以选择应用推荐的更改或不应用。
• 你的想法在这里！