Claude Code 和 VSCODE合体

自从开始使用Claude Code之后，解决了大模型集成问题之后，开始琢磨如何在IDE中集成，使用起来多一个选择。研究后发现非常有意思的地方，看具体下文。

Claude Code的安装，以及ccr模式（claude-code-router） (Claude Code + claude-code-router白嫖魔搭社区千问模型，开启AI编程之路Claude Co - 掘金)

一只有使用claude原生模式才可以集成到IDE,ccr code模式不行

二 ccr code模式如何转换为原生模式

只有使用claude原生模式才可以集成到IDE,ccr code模式不行

1 第一步，先打开vscode，并且打开你需要的编辑的代码工程目录，比如这里是D:\Develop\Nodejs\helloworld

2 第二步，打开命令行窗口，注意一定要切换到同一个目录下运行

cmd 复制代码

cd D:\Develop\Nodejs\helloworld
D:\Develop\Nodejs\helloworld>claude

在对话窗口敲入/ide

bash 复制代码

 > /ide  [open]                                                                                                       │
╰──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯
  /ide     Manage IDE integrations and show status

按下回车

vbnet 复制代码

╭──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮
│                                                                                                                      │
│  Select IDE                                                                                                          │
│  Connect to an IDE for integrated development features.                                                              │
│                                                                                                                      │
│   > 1. Visual Studio Code√                                                                                           │
│     2. None                                                                                                          │
│                                                                                                                      │
│  ※ Tip: You can enable auto-connect to IDE in /config or with the --ide flag                                         │
│                                                                                                                      │
╰──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯
 Enter to confirm · Esc to exit

注意这里选择

css 复制代码

> 1. Visual Studio Code√

等待，然后切回vscode，选择一个文件，看到窗口右上角的claude标志，

点击即可在vscode中启动：

ccr code模式如何转换为原生模式

上述操作必须在命令行原生模式 claude启动，如果采用ccr code模式是不行的。但是，但是，但是有个转换，可以将ccr code转换为claude模式来兼容。修改环境变量的值为

ini 复制代码

ANTHROPIC_API_KEY=myapikey 
ANTHROPIC_AUTH_TOKEN=http://127.0.0.1:3456

这里的myapikey是在 C:\Users\用户名.claude-code-router中的config.json文件中配置的，如下

json 复制代码

{
  "LOG": false,
  "CLAUDE_PATH": "",
  "HOST": "127.0.0.1",
  "PORT": 3456,
  "APIKEY": "myapikey",
  "API_TIMEOUT_MS": "600000",
  "PROXY_URL": "",
  "Transformers": [],

有一行

json 复制代码

"APIKEY": "myapikey",

你可以换成自己喜欢的任意长字符串，如果为""空的话，环境变量ANTHROPIC_API_KEY的值可以随意写。还有一行是

然后重新启动ccr

ruby 复制代码

C:\Users\ynzys>ccr start
⚠️ API key is not set. HOST is forced to 127.0.0.1.
127.0.0.1
Loaded JSON config from: C:\Users\ynzys\.claude-code-router\config.json
register transformer: Anthropic (endpoint: /v1/messages)
register transformer: gemini (endpoint: /v1beta/models/:modelAndAction)
register transformer: vertex-gemini (endpoint: /v1/projects/:projectId/locations/:location/publishers/google/models/:modelAndAction)
register transformer: vertex-claude (endpoint: /v1/projects/:projectId/locations/:location/publishers/anthropic/models/:modelAndAction)
register transformer: deepseek (no endpoint)
register transformer: tooluse (no endpoint)
register transformer: openrouter (no endpoint)
register transformer: maxtoken (no endpoint)
register transformer: groq (no endpoint)
register transformer: cleancache (no endpoint)
register transformer: enhancetool (no endpoint)
register transformer: reasoning (no endpoint)
register transformer: sampling (no endpoint)
register transformer: maxcompletiontokens (no endpoint)
modelscope provider registered
🚀 LLMs API server listening on http://127.0.0.1:3456

然后再命令行运行claude 这里看到API的URL为http://127.0.0.1:3456 就对了，它会通过这个代理访问ccr配置文件中的模型API。