Claude Code GUI / ChatUI — VS Code 插件

Claude Code ChatUI 是 Claude Code CLI 的全功能 GUI 界面插件，支持 VS Code 和 Cursor。Windows 原生运行（无需 WSL），同时支持 macOS。兼容官方 Anthropic 账号和第三方 API（GUI 界面配置）。核心功能：MCP 插件管理、Skills 系统、Hooks 系统、实时 Token 消耗追踪、AI 助手集成（Gemini + Grok），支持中英文界面。持续活跃更新，已有 236+ commits。

🌐 语言: English | 简体中文 | 繁體中文

说明： 本扩展通过自动化操作官方 claude 交互式 CLI 来提供图形界面。它不修改身份认证、不代理网络流量、不接触你的凭证 —— 而是复用你已登录的订阅。请阅读并遵守 Anthropic 服务条款。

为什么选择这个插件？

功能	官方 Claude Code	Claude Code GUI (MaheshKok)	Claude Code UI (AuraTech)	本项目
Windows 免 WSL	❌ 需要配置	❌ 需要 CLI 配置	WSL 路径映射	✅ 原生支持
第三方 API GUI 配置	❌	❌	❌	✅ 独有
MCP 插件 GUI 管理	仅 CLI 级别	✅ MCP Hub	✅ MCP 命令	✅ GUI 配置（全局 + 工作区）
Skills 系统 GUI	仅 CLI 级别	❌	❌	✅ 独有
Hooks 系统 GUI	仅 CLI 级别	❌	❌	✅ 独有
AI 助手集成	❌	❌	❌	✅ Gemini + Grok
实时 Token 追踪	❌	✅ 用量仪表盘	✅ 成本追踪	✅
macOS 支持	✅	✅	✅	✅
npm + 原生安装器	✅	✅	✅	✅
持续活跃更新	✅	✅	✅	✅ (236+ commits)

📸 界面预览

📅 更新历史

版本	日期	亮点
v5.0.8	2026-06-15	默认启用 1M token 上下文窗口——长会话会在约 165K token 处悄无声息地撞上 `Prompt is too long`，根因是启动的模型其实从未带上 1M 窗口（裸 `--model claude-opus-4-8` = 200K），而进度条分母却可能被设成 1M 掩盖了真实上限，加上自动压缩已默认关闭、没有兜底。现在驱动会在 spawn 时以及会话中途 `/model` 切换时，给支持 1M 的模型（Opus 4.6/4.7/4.8、Sonnet 4.6）的 `--model` 追加 `[1m]` 后缀，真实窗口由 200K 升到 1M（已 GA，无需 beta header）。通过 `enable1MContext` 开关控制。⚠️ 1M 仅在 Max/Team/Enterprise + Opus 下含在订阅内
v5.0.7	2026-06-16	修复在全新安装的电脑上插件「运行不了」的问题——全新机器会连续弹出两个启动门（工作区信任 + bypass 权限警告），而驱动只应答了第一个、判定就绪后即停止扫描，导致用户首条消息的回车落在第二个门的默认「No, exit」上，`claude` 退出码 1 并不断重启循环。现在两类门各自独立跟踪、并在 spawn 后约 25 秒内持续扫描，确保两个门都被应答
v5.0.6	2026-06-15	修复编辑技能/钩子/任意 `.claude/` 文件时回合卡死约 69 秒的问题（CLI 对自身配置的「编辑确认菜单」`bypassPermissions` 也不自动通过、PTY 驱动答不了，现自动选「本会话授权」一次解决后续编辑）。默认禁用框架的有损自动压缩（`DISABLE_AUTO_COMPACT=1`，手动 `/compact` 仍可用）。恢复 subagent（Agent/Task）工具步骤的内联显示且不重复计费 token。Context Window 默认 200K→400K
v5.0.5	2026-06-15	修复 `/compact` 期间或切换会话后消息被静默吞掉的问题（compact 模式标志现在会在每次切换会话时重置；压缩进行中发送会明确提示"正在处理中，请稍候"而不再丢失）。同时把过大的 QUESTION 选项卡标题（`.ask-question-header` 14px→13px）缩小，使其不再比对话徽章高出一截
v5.0.4	2026-06-15	打包修复：v5.0.3 的 VSIX 因 `--no-dependencies` 漏打了原生 `node-pty`，导致装得上但聊天面板打不开。现已正确打包 node-pty 的 win32-x64 二进制
v5.0.3	2026-06-15	交互式选项卡片：禁用原生 `AskUserQuestion`，Claude 改用围栏 ```ask 块输出问题，前端渲染成可点击的单选/多选卡片，点击即把所选 label 作为下一轮消息注入。修复 ask 块跟在工具调用后（`stop_reason: null`）导致的「仍在处理」锁死，并优化卡片布局与字体
v5.0.2	2026-06-14	图片首轮即视觉：分步 PTY 注入让粘贴/选择的图片以原生 `[Image #N]` 多模态附件进入对话（0 次 `Read`，不再「我看不到图」）；重注入看门狗下幂等；无 chip 时降级走 `Read` 不丢图；中文/空格路径与多图已验证
v5.0.1	2026-06-13	PTY 交互模式驱动替代 `claude -p`（用量计入你的订阅额度）；输出改从 transcript JSONL 读取；新增权限模式设置；可选的 Stop hook 完成兜底；仅支持 win32-x64
v4.1.3	2026-06-02	新增 Claude Opus 4.8 模型支持；Opus 4.7 降级为 Previous；Opus 4.5 从 UI 隐藏（保留用于历史会话与费用计算）
v4.1.2	2026-05-18	安全修复：npm audit 漏洞 23→5；tsconfig 严格检查（noImplicitReturns、noUnusedParameters）；代码去重：统一 escapeHtml、集中 MODEL_DISPLAY_NAMES、通用 openModal/closeModal
v4.1.1	2026-04-21	Gemini Vertex AI ADC 认证模式；MCP 子进程环境变量回填修复（APPDATA/PATH/代理）；Windows `node` stdio 包装 bug 修复；认证 UI 两级层级化
v4.1.0	2026-04-16	Opus 4.7 模型支持；xHigh 思考强度；/ultrareview 命令；Compute Mode 恢复 bug 修复
v4.0.10	2026-04-13	修复 Cursor 历史切换闪退；修复历史面板 XSS 注入
v4.0.9	2026-04-02	项目元数据重写，提升 AI 搜索可发现性
v4.0.8	2026-04-02	Codex MCP 模板，CLAUDE.md 条件注入
v4.0.7	2026-04-02	流解析器升级：6 项 bug 修复，新 CLI 消息类型
v4.0.5	2026-03-30	AI 助手面板：Grok + Vertex AI 支持；macOS 滚动修复
v4.0.2	2026-03-28	Hooks GUI 管理面板：26 事件类型、4 类型、5 模板
v3.1.9	2026-03-29	CSP 安全策略、XSS 修复、Windows 孤儿进程清理
v3.1.8	2026-03-12	Grok MCP 模板，默认模型 → Sonnet 4.6
v3.1.7	2026-02-18	Claude Sonnet 4.6 模型支持
v3.1.4	2026-01-29	新增 macOS 平台支持
v3.1.0	2026-01-13	Skills 面板：复制、启用/禁用、插件保护
v2.0.0	—	全新 UI 设计、统计面板、自定义 API 端点

完整记录请查看 CHANGELOG.md。

📚 推荐教程

🔥 小白必看！ 如果你是第一次接触 Claude Code，强烈推荐阅读这篇保姆级教程：

写给小白的 Claude Code 安装教程（国内直用，Windows 可用） - by @Gorden_Sun

这篇教程详细讲解了从零开始安装 Claude Code 的全过程，包括环境配置、第三方 API 使用等，全程约 30 分钟即可上手。

🚀 快速开始

第 1 步：环境准备

安装 Git for Windows（自带 Git Bash）
安装 Node.js（推荐 LTS 版本，≥ 18）
以管理员权限打开 PowerShell，设置环境变量：

setx SHELL "C:\Program Files\Git\bin\bash.exe"

重启电脑（必须重启才能生效）

第 2 步：安装 Claude Code CLI

重启电脑后，打开新的终端窗口：

npm install -g @anthropic-ai/claude-code

⚠️ VPN 用户：整个安装和使用过程请确保开启 TUN 模式，否则可能无法连接 Claude 服务。

第 3 步：登录 Claude Code

使用官方账号

claude

浏览器会自动打开授权页面，登录后复制 Token 粘贴回终端即可。

使用 🔑 第三方 API 配置

如果你使用第三方 API，需要在插件内进行配置：

按 Ctrl+Shift+C 打开聊天界面
点击右上角的设置按钮 ⚙️
勾选 "Use Custom API Endpoint"
在 API Key 栏填写你的密钥（如 sk-ant-xxxxxxxxxx）
在 Base URL 栏填写 API 地址（如 https://v3.codesome.cn）
设置会自动保存，左下角提示 "Settings updated successfully" 即配置成功

切换回官方账号：取消勾选 "Use Custom API Endpoint" 即可。

💡 提示：

如果 API 密钥错误，聊天会一直显示 "processing" 直到超时

可以随时通过配置开关在官方账号和第三方 API 之间切换

💡 本插件支持各种第三方 API 服务（如 v3.codesome.cn、openrouter.ai），具体 URL 请咨询你的 API 供应商。

第 4 步：安装插件

✨ 方式一：VS Code 市场安装（推荐）

打开 VS Code 或 Cursor
按 Ctrl+Shift+X 打开扩展面板
搜索 Claude-Code ChatUI 或 lkbaba
点击安装

直达链接： ➡️ VS Code 市场

📦 方式二：GitHub Release 下载

🔗 前往 Releases 页面
下载 .vsix 文件
VS Code 中按 Ctrl+Shift+P，选择 "扩展: 从 VSIX 安装..."

🛠️ 方式三：从源码构建

git clone https://github.com/LKbaba/Claude-code-ChatInWindows.git
cd Claude-code-ChatInWindows
npm install
npm run package
# 生成的 .vsix 文件在项目根目录，按方式二安装即可

第 5 步：开始使用

打开聊天界面：按快捷键 Ctrl+Shift+C
文件浏览器图标：新建文件夹按钮旁边有图标，点击即可

❓ 常见问题

Q: 遇到 "No suitable shell found" 错误？

确保已安装 Git for Windows
以管理员权限运行：setx SHELL "C:\Program Files\Git\bin\bash.exe"
重启电脑（必须重启才能生效）

如果问题仍然存在，尝试：

打开系统环境变量设置（Win + X → 系统 → 高级系统设置 → 环境变量）
确保 PATH 中有 C:\Program Files\Git\cmd
重启电脑

Q: 配置了第三方 API 但聊天没有响应？

Claude Code CLI 有点时候需要先在命令行初始化。请在 PowerShell 中运行：

Set-ExecutionPolicy -Scope Process -ExecutionPolicy Bypass -Force
$Env:ANTHROPIC_API_KEY  = "sk-xxxxxxxxxxxxxxxxxxxxxxxx"
$Env:ANTHROPIC_BASE_URL = "https://v3.codesome.cn"
claude

如仍有问题，尝试更新 Claude Code CLI：

npm install -g @anthropic-ai/claude-code@latest

Q: 电脑重启后第三方 API 失效？

环境变量 $Env:ANTHROPIC_API_KEY 和 $Env:ANTHROPIC_BASE_URL 是临时设置，电脑重启后会失效。

有两种解决方案：

方案一：每次重启后重新设置

$Env:ANTHROPIC_API_KEY  = "你的 API Key"
$Env:ANTHROPIC_BASE_URL = "https://v3.codesome.cn"
claude

方案二：设置为永久环境变量（以管理员权限运行）

setx ANTHROPIC_API_KEY "你的 API Key"
setx ANTHROPIC_BASE_URL "https://v3.codesome.cn"
# 重启电脑后生效

Q: 遇到 "rg: command not found" 错误？

这是可选的，不影响正常使用。如果想安装 ripgrep 以获得更好的搜索性能：

# 在 Git Bash 中：
curl -L https://github.com/BurntSushi/ripgrep/releases/download/14.1.0/ripgrep-14.1.0-x86_64-pc-windows-msvc.zip -o ripgrep.zip
unzip ripgrep.zip && mkdir -p ~/bin
cp ripgrep-14.1.0-x86_64-pc-windows-msvc/rg.exe ~/bin/
echo 'alias rg="~/bin/rg"' >> ~/.bashrc && source ~/.bashrc

注意：扩展内置的 Grep 工具即使没有 ripgrep 也能正常工作。

Q: Claude 编辑文件时遇到 "File has been unexpectedly modified" 错误？

这个错误通常是因为 VS Code/Cursor 的自动保存功能在 Claude 读取和编辑文件之间修改了文件。

解决方案：关闭自动保存

在 VS Code/Cursor 设置 (settings.json) 中添加：

"files.autoSave": "off"

或者使用更温和的选项：

"files.autoSave": "onWindowChange"

为什么会发生这个问题：

Claude 读取文件并存储内容哈希值
自动保存触发，修改了磁盘上的文件
Claude 尝试编辑文件，但哈希值不再匹配
Claude 报告 "File has been unexpectedly modified"

其他可能导致此问题的设置：

editor.formatOnSave: true - 保存时格式化会修改文件内容
files.trimTrailingWhitespace: true - 保存时删除行尾空格
files.insertFinalNewline: true - 保存时在文件末尾添加换行符

如果你需要这些功能，可以考虑在使用 Claude Code 时临时禁用它们。

🤝 如何参与贡献

Fork 本项目，创建独立分支
聚焦一个新功能或痛点优化
在真实 Windows 环境充分测试
提交 Pull Request，描述清晰易懂

欢迎所有 Windows 上的 AI 工程师、开发者、极客加入！

📝 开源许可证

本项目基于 MIT 协议 开源。详见 LICENSE。

🙏 致谢

andrepimenta – 原始项目 claude-code-chat
Mrasxieyang (linux.do 社区) – 提供了 Windows 原生安装的核心问题解决方案
Anthropic – 创造出强大的 Claude 与 Claude Code
所有为 Claude Code 应用生态添砖加瓦的开发者们 ❤️

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Claude Code GUI / ChatUI — VS Code 插件

为什么选择这个插件？

📸 界面预览

📅 更新历史

📚 推荐教程

🚀 快速开始

第 1 步：环境准备

第 2 步：安装 Claude Code CLI

第 3 步：登录 Claude Code

使用官方账号

使用 🔑 第三方 API 配置

第 4 步：安装插件

✨ 方式一：VS Code 市场安装（推荐）

📦 方式二：GitHub Release 下载

🛠️ 方式三：从源码构建

第 5 步：开始使用

❓ 常见问题

🤝 如何参与贡献

📝 开源许可证

🙏 致谢

FilesExpand file tree

README.zh-CN.md

Latest commit

History

README.zh-CN.md

File metadata and controls

Claude Code GUI / ChatUI — VS Code 插件

为什么选择这个插件？

📸 界面预览

📅 更新历史

📚 推荐教程

🚀 快速开始

第 1 步：环境准备

第 2 步：安装 Claude Code CLI

第 3 步：登录 Claude Code

使用官方账号

使用 🔑 第三方 API 配置

第 4 步：安装插件

✨ 方式一：VS Code 市场安装（推荐）

📦 方式二：GitHub Release 下载

🛠️ 方式三：从源码构建

第 5 步：开始使用

❓ 常见问题

🤝 如何参与贡献

📝 开源许可证

🙏 致谢