企业官网建设流程全解析

ccInOne：把 Claude Code 装进浏览器，打造你的个人 AI 编程驾驶舱

一个命令启动，浏览器里管理所有 Claude Code 项目。开源、零依赖、Windows 原生。

这是什么

ccInOne是一个 Windows 原生的 Claude Code Web 控制台。

你在终端里用claude命令写代码，时间久了，项目一多，会话一多，Bash 里翻~/.claude/projects/找历史会话会非常痛苦。

ccInOne 解决了这个问题：一个命令启动，浏览器里管理所有 Claude Code 项目、会话、对话。像 ChatGPT 一样聊，背后是 Claude Code。

为什么做这个

三个痛点驱动：

1. 历史会话难找

Claude Code 把会话存成 JSONL 文件，散落在项目目录里。想找回三天前和 AI 讨论架构的那段对话——得在文件系统里翻半天。

ccInOne 自动扫描所有项目，按最近活动排序，一个页面全看到。

2. 终端里读代码太累

AI 输出的代码块、markdown、tool call 结果，在黑白终端里堆在一起。ccInOne 渲染代码高亮、折叠 tool call、支持 markdown 排版，像读文档一样读 AI 输出。

3. 跨设备用不了

Claude Code 绑定终端。想用手机或平板查看 AI 生成的方案？ccInOne 启动后局域网都能访问。

和 Claude Code 原生界面有什么区别

核心功能

项目管理

自动发现本机所有 Claude Code 项目，按最近活动排序，收藏常用项目置顶。

会话管理

新建、继续、隐藏会话。支持滚到顶自动加载更早消息，几千条历史消息也能流畅翻阅。

代码阅读优化

• 代码块语法高亮，JetBrains Mono等宽字体
• Tool call 折叠显示，点击展开查看详情
• Markdown 完整渲染（表格、引用、列表）
• 消息区保留衬线字体 —— 长文阅读更舒适

命令输入区

桌面端嵌入式 command dock，移动端底部固定，44x44 触摸友好发送按钮。

技术架构

浏览器 → control-plane (Web UI + API 网关) → CC adapter (HTTP API) → Claude CLI

三个进程，零外部依赖（不依赖 npm 包，纯 Node.js 内置模块）：

• control-plane：渲染 Web UI，转发 API 请求
• CC adapter：管理 Claude Code 会话，启动claude子进程
• Claude CLI：执行实际的 AI 推理

一键部署

前提

• Windows 10/11
• Node.js（setup.ps1会自动检测，未安装则引导安装）
• Claude Code CLI（已登录claude）

三步启动

git clone git@gitcode.com:gcw_A202cbBm/ai-cli.git cd ai-cli.\setup.ps1

setup.ps1会自动完成：

1. 检测 Node.js 和 Claude CLI 是否就绪
2. 自动从环境变量读取 API 配置（无需手动填 key）
3. 检测端口可用性（Windows 保留端口自动切换备用端口）
4. 启动服务并打开浏览器

完成后浏览器自动打开http://127.0.0.1:3209。

手动启动

.\start-ccinone.ps1# 备用端口：$env:PORT=13209;$env:CC_PORT=13212;.\start-ccinone.ps1

安全性

如果你需要局域网内其他设备访问，防火墙放行端口即可（setup.ps1会提示命令）。

设计风格

Quiet Dev Console— 安静、精密、低对比。

• 暖灰底色#f5f1eb，长时间看不刺眼
• 烧陶红#b84a2c作为唯一强调色
• UI 控制区无衬线，对话正文保留衬线（可读性优先）
• 代码区深色底，与正文区分明确

开源地址

GitCode：git@gitcode.com:gcw_A202cbBm/ai-cli.git

如果觉得有用，欢迎点赞、转发、评论、关注。