Claude Code Gui

克劳德代码GUI

一个全面的桌面GUI包装器 Claude 代码命令行界面 --Anthropic的官方命令行工具，用于与Claude一起作为AI编码助手工作。

Claude Code GUI为您提供了一个可视化界面，涵盖了Claude Code提供的所有功能：终端会话、实时结构化流视图、Claude.md编辑、内存管理、MCP服务器配置、技能、代理、钩子、权限等。

每次启动时，您都会选择要打开的项目文件夹，确认您信任它，然后将完整的IDE加载到该目录中——就像VS Code的工作区信任模型一样。

v1.1.0的新增功能

直播流——双向结构化视图

v1.1.0的标题功能。当克劳德在你的终端工作时 流 页面显示了它实时执行的操作——结构化和干净的，而不是原始的ANSI转义码：

• 工具调用 呈现为带有图标的可折叠卡片（文件读取、写入、bash、web、代理）
• 辅助文本 呈现为适当的markdown——标题、代码块、列表
• 工具结果 显示为截断“显示更多”扩展
• 运行摘要 显示成本（美元）、持续时间（秒）和通过/失败状态
• 双向 --在终端中写入，它会自动流式传输；键入Stream输入，它将转到终端
• 弹出式车窗 --将流分离到一个浮动窗口中，与终端并排放置；弹出窗口尊重您选择的应用程序主题
• 复制按钮 --悬停任何卡片以显示复制按钮； 复制全部 在标头中，将整个流序列化为纯文本
• 一直在看 --流在挂载时自动启动，跟踪所有活动的Claude会话JSONL文件，无需任何手动切换

终端

• 完整的PTY终端（节点PTY+xterm.js）——不是简单的exec包装器
• 从工具栏中选择模型（Opus、Sonnet、Haiku）
• 颜色主题 --8种内置终端配色方案（德古拉、日光黑/亮、北、Monokai、东京之夜、Gruvbox、One Dark），带实时切换
• 多个并发会话选项卡
• 会话之间的会话内存切换
• 提示词作曲家 -AI供电的提示增强（直接使用Anthropic API以提高速度，为Pro/Max/Enterprise用户提供CLI回退）
• 会话摘要 --人工智能生成的会话摘要保存为记忆

配置

• CLAUDE.md编辑器 --使用实时预览、模板和@import检测编辑所有4个级别（全局、项目、本地、私有）
• 存储器系统 --使用基于树的UI和8级层次结构查看器浏览和编辑Claude Code的自动内存文件
• 规则管理器 --创建和管理 .claude/rules/*.md 通过YAML frontmatter进行路径范围定位
• 设置 --用于用户、项目和本地设置范围的可视化和JSON编辑器

扩展

• 技能 --浏览、创建和管理可重用的提示模式（斜线命令）；包括来自已安装插件的插件技能，这些插件具有可折叠的组
• 子代理 --使用自定义指令和工具访问配置专门的AI角色
• 命令 --触发特定提示的自定义斜线命令
• 钩子 --事件驱动的自动化（PreToolUse、PostToolUse、SessionStart等）
• MCP服务器 --拥有30多个预配置服务器（GitHub、Slack、Brave Search、PostgreSQL等）以及手动配置的市场
• 插件 --MCP服务器发现和管理

管理

• 权限 --可视化工具允许/拒绝列表管理
• 会话 --查看活动PTY会话并管理会话内存
• 项目 --使用配置健康扫描程序、文件浏览器和活动跟踪打开项目目录
• 活动径 --查看Claude在会话期间创建或修改的每个文件，包括项目外部的文件（scratchpad、tmp、config）。通过时间范围过滤（1h/4h/24h/7d/30d）按位置分组。
• 分析 --直接从Claude Code自己的会话日志中解析令牌使用、成本跟踪和会话历史(~/.claude/projects/).5选项卡仪表板：概述、模型、项目、会话和30天成本时间表。没有外部跟踪——所有数据都保持在本地。
• 文件浏览器 --导航项目文件、查看内容、复制到剪贴板，并直接执行脚本（.py、.js、.ts、.sh）
• API密钥 --使用20多个预设模板管理环境变量
• 仪表盘 --系统健康状况概述，包括统计卡和活动提要

入职

• 项目选择器 --每次启动时，在出现任何终端或IDE UI之前，全屏欢迎屏幕都会提示您打开项目文件夹
• 工作区信任 --新文件夹显示安全警告；以前受信任的文件夹会被绿色盾牌徽章记住，并一键打开
• 最近的项目 --最多列出10个最近使用的文件夹，以便快速重新打开

设计

• 一键切换的明暗主题——所有UI元素在两种模式下都完全可见
• 支持折叠的响应式侧边栏
• macOS原生标题栏集成

Bug修复和改进

配置页面——删除+重启提示（v1.1.0之后）

• 删除代理 --悬停任何代理卡以显示编辑和删除按钮。单击“删除”将显示永久删除文件之前的确认模式。
• 删除命令 --同样的悬停显示了命令页面上的删除模式，并带有确认模式。
• 钩子和技巧 --删除已可用；现在所有四个配置页面（代理、命令、钩子、技能）都是一致的。
• 重新启动横幅 --在代理、命令、钩子或技能上进行任何创建、编辑或删除后，会出现一个横幅，说明需要重新启动Claude Code才能获取更改。包括a 现在重启 立即重新启动应用程序的按钮，或用✕ 稍后重新启动。

直播流——子代理流（v1.1.0之后）

四个修复程序使子代理活动在流面板中完全可见：

• 子代理JSONL发现 --会话观察器现在会递归到子目录中，因此子代理在 ~/.claude/projects/{project}/{session}/subagents/{agent}.jsonl 被自动发现和追踪。以前只监视顶级会话文件。
• 子代理工具调用渲染 --分代理轮流到达 progress 父JSONL中的条目。解析器现在读取 entry.data?.message （不是 entry.message)因此，子代理的工具调用和辅助文本在流中正确呈现。
• 子代理会话偏移 --会话中发现的新JSONL文件现在从偏移量0读取，因此当子代理开始写入新文件时，不会跳过任何内容。
• 新线保护 --辅助文本气泡现在保留了嵌入的换行符，因此多段响应和代码块不再折叠成一行。

先决条件

你需要 Claude 代码命令行界面 安装和 一 关于：

• 人类API密钥(ANTHROPIC_API_KEY)，或
• Claude Pro、Max或Enterprise订阅（通过身份验证 claude login)

这两条路径都得到了完全支持。API关键用户获得更快的人工智能功能（直接API调用）。Pro/Max/Enterprise用户通过CLI回退获得相同的功能。

安装Claude代码命令行界面

本机安装程序（推荐）：

brew install claude-code

通过npm：

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

入门指南

# Clone the repository
git clone https://github.com/markes76/claude-code-gui.git
cd claude-code-gui

# Install dependencies
npm install

# Start development server
npm run dev

构建

# Build for current platform
npm run build

# Platform-specific builds
npm run build:mac     # macOS .dmg
npm run build:win     # Windows .exe
npm run build:linux   # Linux AppImage

建筑

src/
  main/              # Electron main process
    index.ts         # Window creation, IPC registration
    cli-bridge.ts    # Claude CLI integration (direct node execution)
    file-handlers.ts # Secure file operations + activity scanning
    config-handlers.ts # Claude Code config read/write
    pty-bridge.ts    # PTY session management (node-pty)
    stream-bridge.ts # Live stream: JSONL file polling + pop-out window
    session-memory.ts # Session memory persistence
  preload/           # Context bridge (main ↔ renderer)
    index.ts         # Exposes safe API to renderer
  renderer/          # React SPA
    src/
      pages/         # 19 page components
      components/    # Shared UI components
      stores/        # Zustand state management
      types/         # TypeScript type definitions
      lib/           # Utilities

CLI网桥架构

该应用程序使用一个强大的CLI桥，在打包的Electron应用程序中可靠地工作：

1. 解析Claude CLI二进制文件 通过以下符号链接查找实际 cli.js 脚本
2. 查找Node.js二进制文件 （nvm、Homebrew、系统）独立
3. 直接执行 作为 node /path/to/cli.js --完全绕过外壳
4. 倒退 如果直接模式失败，登录shell执行

这解决了常见的Electron打包应用程序问题 process.cwd() 回报 / 和 PATH 最小(/usr/bin:/bin).

技术栈

安全

• 路径验证 --所有文件操作验证路径都在用户的主目录或/tmp中
• 壳牌逃逸 --PTY命令使用适当的外壳逃逸来防止注射
• 型号允许列表 --只能选择经批准的Claude型号
• 无远程代码 --该应用程序完全在本地运行，没有外部遥测

许可证

麻省理工学院

贡献

欢迎投稿！请打开问题或拉取请求。

积分

作为GUI包装器构建 克劳德代码 通过Anthropic。