内容
<div align="center">
<img src="public/logo.png" alt="Pixcode logo" width="92" height="92" />
<h1>Pixcode</h1>
<p><strong>自托管 AI 编程代理控制面板。</strong></p>
<p>
Pixcode 允许您运行 AI 编程 CLI,检查文件,管理 shell 和源代码控制,
编排代理团队,通过 API 自动化,并从您的计算机或服务器保持长时间运行的工作。
</p>
<p>
<a href="https://www.npmjs.com/package/@pixelbyte-software/pixcode"><img src="https://img.shields.io/npm/v/@pixelbyte-software/pixcode?style=for-the-badge&color=10b981" alt="npm 版本" /></a>
<a href="https://github.com/alicomert/pixcode/releases/latest"><img src="https://img.shields.io/github/v/release/alicomert/pixcode?style=for-the-badge&color=0ea5e9" alt="最新版本" /></a>
<img src="https://img.shields.io/badge/Node.js-22%2B-3c873a?style=for-the-badge" alt="Node.js 22+" />
<img src="https://img.shields.io/badge/Desktop-Windows%20%7C%20macOS%20%7C%20Linux-6366f1?style=for-the-badge" alt="桌面平台" />
<a href="LICENSE"><img src="https://img.shields.io/badge/License-MIT-blue?style=for-the-badge" alt="MIT 许可证" /></a>
<a href="https://github.com/alicomert/pixcode/discussions"><img src="https://img.shields.io/badge/Discussions-open-9ca3af?style=for-the-badge" alt="讨论" /></a>
</p>
<p>
<a href="https://buymeacoffee.com/alicomert" target="_blank" rel="noopener noreferrer"><img src="https://img.shields.io/badge/Buy%20me%20a%20coffee-support%20Pixcode-ffdd00?style=for-the-badge&logo=buymeacoffee&logoColor=000000" alt="给我买杯咖啡" /></a>
</p>
<p>
<a href="https://www.producthunt.com/products/pixcode?embed=true&utm_source=badge-featured&utm_medium=badge&utm_campaign=badge-pixcode" target="_blank" rel="noopener noreferrer"><img alt="Pixcode - 自托管 AI 编程代理控制面板。 | Product Hunt" width="250" height="54" src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=1144104&theme=light&t=1778502023682"></a>
</p>
<p>
<a href="https://alicomert.github.io/pixcode/landing.html">官网</a> ·
<a href="https://github.com/alicomert/pixcode/releases/latest">版本</a> ·
<a href="public/docs.html">文档</a> ·
<a href="public/openapi.yaml">OpenAPI</a> ·
<a href="CONTRIBUTING.md">贡献</a>
</p>
<p>
<a href="README.tr.md">土耳其语</a> ·
<a href="README.de.md">德语</a> ·
<a href="README.ru.md">俄语</a> ·
<a href="README.ja.md">日语</a> ·
<a href="README.ko.md">韩语</a> ·
<a href="README.zh-CN.md">简体中文</a>
</p>
</div>
## Pixcode 功能
Pixcode 是一个本地的 AI 编程代理网页和桌面工作空间。它封装了开发者已经使用的 CLI,然后在它们周围添加了缺失的控制层:
项目选择、聊天历史、文件导航、shell 访问、Git/本地更改跟踪、编排、通知、Telegram 控制和 API 自动化。
在以下情况下使用它:
- 您希望 Claude Code、Cursor CLI、Codex、Gemini CLI、Qwen Code 和 OpenCode 在同一个项目屏幕上可用。
- 您希望代理输出、编辑的文件、shell 命令、Git 状态和任务规划在无需切换工具的情况下可见。
- 您希望一个服务器或桌面应用程序在您从另一台计算机、平板电脑、手机或 Telegram 连接时保持工作运行。
- 您希望一个真正的 API 接口,以便其他工具可以创建会话、运行代理、检查项目并使用 `px_` API 密钥自动化工作流程。
Pixcode 不是一个托管的云 IDE。您的源代码、CLI 会话、凭证、项目路径、MCP 配置、本地数据库和自动化密钥保留在运行 Pixcode 的机器上,除非您有意公开或连接它们。
## 截图
| 工作空间控制中心 | 移动聊天 |
| --- | --- |
| <img src="public/screenshots/desktop-main.png" alt="Pixcode 桌面工作空间,带有聊天、项目控件和侧面板" width="480" /> | <img src="public/screenshots/mobile-chat.png" alt="Pixcode 移动聊天" width="260" /> |
| CLI 选择 | 工具和 MCP |
| --- | --- |
| <img src="public/screenshots/cli-selection.png" alt="Pixcode CLI 选择" width="420" /> | <img src="public/screenshots/tools-modal.png" alt="Pixcode 工具和 MCP 面板" width="420" /> |
## 核心功能
### 多 CLI 代理工作空间
Pixcode 为每个支持的编码 CLI 提供了一个共享的工作空间,而不会隐藏提供者原生的行为。您可以连接您已经使用的提供者,并在同一个项目中切换它们。
- Claude Code
- Cursor CLI
- OpenAI Codex
- Gemini CLI
- Qwen Code
- OpenCode
提供者面板涵盖身份验证状态、安装检查、CLI 版本、模型选择、MCP 支持和会话历史记录。当代理正在思考、运行工具、等待批准或写入输出时,UI 会保持可见的处理状态,而不是让屏幕感觉冻结。
### 为开发工作而设计的聊天
Pixcode 聊天是项目感知的,专为长时间的编码会话而设计。
- 聊天屏幕上的固定底部编辑器。
- 每个提供者和项目的会话历史记录。
- 支持默认、计划和运行样式的模式。
- 斜杠命令友好型输入。
- 计划、文件操作、命令输出和提供者状态事件的工具输出渲染。
- 工作完成、失败或需要关注时的 Telegram 和浏览器/桌面通知。
### 文件、shell 和源代码控制
侧面板是围绕编码代理更改项目的方式构建的。
- 具有详细和紧凑视图的文件面板。
- 文件打开/编辑流程,保留主聊天或编排界面。
- 具有桌面和移动安全行为的 shell 面板。
- Git 状态、差异、分支、提交和更改文件的源代码控制面板(当项目是 Git 仓库时)。
- 非 Git 仓库项目的本地更改跟踪。
### 更改文件的命令中心
命令中心监视代理工作时的更改。它可以跟踪 Git 更改或本地文件系统更改,在活动聊天旁边显示更改的文件列表,
突出显示更改的项目,并打开相关位置的已编辑文件。
这旨在回答一个实际问题:“代理刚刚修改了什么?”
### 多代理编排
Pixcode 可以运行结构化的代理工作流程,而不是将每个提示发送给一个代理。
内置的工作流样式包括:
- 代理团队:将作业分成实现、审查、文档、测试或自定义角色。
- 顺序移交:在每个阶段之间传递紧凑的上下文。
- 多模型审查:比较同一代码或计划的不同提供者/模型意见。
- 决策辩论:让多个代理在采取行动之前讨论方法。
编排控件包括:
- 每个代理的提供者和模型选择。
- 自定义标签、角色和说明。
- 重复提供者,以便多个工作者使用相同的 CLI。
- 步骤失败的备用 CLI 选择。
- 执行前的运行预览。
- 流式步骤输出和最终报告。
- 可调整大小的设置/输出窗格。
### 后台编排
Pixcode 包含一个项目感知的编排控制平面,用于后台代理工作。它在当前的 Pixcode 实例中运行,理解活动项目上下文,
并可以通过终端优先的 CLI 适配器将有界任务路由到 Claude Code、Codex、Cursor、Gemini、Qwen 或 OpenCode。
编排控件包括:
- 项目范围的任务上下文。
- 提供者/模型路由。
- 流式任务状态和工件。
- 工作流运行协调。
- 后台检查和预览。
- `/api/orchestration` 下的身份验证本地 API。
### API 优先的自动化
Pixcode 的前端使用与外部自动化公开的相同的后端控制平面。生成一个 `px_` API 密钥,并从您自己的工具、脚本、CI、仪表板或 Telegram 桥调用 REST/WebSocket API。
列出项目:
```bash
curl http://localhost:3001/api/projects \
-H "Authorization: Bearer px_your_key_here"
```
运行提供者任务:
```bash
curl http://localhost:3001/api/agent \
-H "Authorization: Bearer px_your_key_here" \
-H "Content-Type: application/json" \
-d '{
"provider": "codex",
"projectPath": "/home/me/project",
"message": "Review the current diff and list risky changes.",
"stream": false
}'
```
预览编排工作流:
```bash
curl http://localhost:3001/api/orchestration/workflows/agent_team/preview \
-H "Authorization: Bearer px_your_key_here" \
-H "Content-Type: application/json" \
-d '{
"metadata": {
"agents": [
{ "adapterId": "codex", "label": "Backend", "role": "backend" },
{ "adapterId": "opencode", "label": "Reviewer", "role": "review" }
]
}
}'
```
旧版 `ck_` 密钥仍被接受用于旧安装,但 `px_` 是当前前缀。
OpenAPI 参考:[`public/openapi.yaml`](public/openapi.yaml)
### Telegram、通知和远程控制
Pixcode 可以将 Telegram 聊天与您的帐户配对,以便在任务完成、运行失败和需要操作时通知您。
目标不仅仅是最终通知:Telegram 桥接器是一个控制表面,用于远程提示、提供者/会话选择和长时间运行的工作。
通知界面包括:
- 应用内警报。
- 浏览器/桌面通知(如果平台允许)。
- Telegram 任务通知。
- 更新通知和发行说明。
### 主题系统
Pixcode 具有真正的外观系统,而不仅仅是一个固定的蓝色/海军色调。
- 暗色和亮色模式。
- 预制强调色调,包括翡翠和 VS Code 类似选项。
- 暗色和亮色主题的自定义强调色。
- 基于令牌的样式,用于焦点环、活动控件、按钮、导航和面板。
### MCP 和插件
Pixcode 包括用于本地工作流的扩展点:
- 支持的提供者的 MCP 服务器管理。
- 提供者特定的身份验证、MCP 和会话面板。
- 插件加载,带有可选的前端选项卡和后端服务。
- API 密钥、基本 URL、模型目录和提供者安装状态的本地设置。
## 安装
### 要求
- Node.js 22 或更新版本。
- 您要使用的提供者 CLI,需要单独安装和身份验证。
### 使用 npx 运行
```bash
npx @pixelbyte-software/pixcode
```
打开:
```text
http://localhost:3001
```
### 全局安装
```bash
npm install -g @pixelbyte-software/pixcode
pixcode
```
### 桌面安装程序
从 GitHub Releases 下载桌面构建:
- Windows:`.exe`
- macOS:`.dmg`
- Linux:AppImage 或软件包资产,具体取决于版本
版本:<https://github.com/alicomert/pixcode/releases/latest>
#### macOS Gatekeeper: “Pixcode 已损坏”
当前的 macOS 桌面构建可能未签名。如果 macOS 显示 `Pixcode is damaged and can't be opened. You should move it to the Trash`,首先确保 DMG 来自官方 Pixcode GitHub Releases 页面,然后:
1. 打开 DMG 并将 `Pixcode.app` 拖到 `/Applications`。
2. 双击 DMG 中的 `Fix Gatekeeper.command`。
3. Pixcode 从 `/Applications/Pixcode.app` 移除隔离标志,可以正常打开。
手动备用:
```bash
xattr -dr com.apple.quarantine "/Applications/Pixcode.app"
open "/Applications/Pixcode.app"
```
### Linux 守护进程
用于服务器或 VDS 设置:
```bash
pixcode daemon install --mode auto --port 3001
pixcode daemon status --mode auto
pixcode daemon logs --mode auto
pixcode daemon restart --mode auto
```
前台模式:
```bash
pixcode --no-daemon
```
### 端口
- 已安装的后端和捆绑的前端:`SERVER_PORT`,默认为 `3001`。
- 仅 Vite 前端开发:`VITE_PORT`,默认为 `5173`。
对于正常安装的使用,请考虑一个端口:`3001`。端口 `5173` 仅用于单独的 Vite 前端开发。
## 首次运行
1. 打开 Pixcode 并创建或登录到本地用户帐户。
2. 添加要管理的项目文件夹。
3. 连接您实际使用的 CLI 提供者。
4. 打开设置并检查提供者安装/身份验证/模型状态。
5. 如果您需要后台工作流和审查流程,请使用编排。
6. 为外部自动化生成 `px_` API 密钥。
7. 如果您需要远程提示和完成通知,请配对 Telegram。
8. 在外观下选择您的主题调色板。
## 开发
```bash
npm install
npm run typecheck
npm run lint
npm run build
```
重要开发说明:
- `npm run dev` 在 Linux 上使用守护进程管理器。
- 对于前台开发循环,请分别运行 `npm run client` 和 `npm run server`,或运行 `pixcode --no-daemon`。
- `npm run server` 从 `dist-server/` 运行已构建的输出;在后端更改后重新构建。
- 目前没有配置单元测试套件。使用烟雾脚本、类型检查、lint、构建和手动提供者/API 检查。
## 仓库地图
- `src/` - React + Vite 前端。
- `server/` - Express、WebSocket、CLI 适配器、路由、身份验证、守护进程、通知。
- `server/modules/orchestration/` - 多代理工作流引擎和 CLI 适配器。
- `server/modules/providers/` - 提供者身份验证、MCP、会话、模型和安装端点。
- `shared/` - 前端和后端共享的合约。
- `public/openapi.yaml` - 随应用程序提供的 API 参考。
- `public/screenshots/` - README 和产品截图。
- `public/llms.txt` 和 `public/llms-full.txt` - AI 发现摘要。
## 开源准备
Pixcode 已准备好公共贡献,具备贡献者期望的基本条件:
- 具有目的、安装命令、截图、API 示例和架构图的清晰 README。
- MIT 许可 — 参见 [`LICENSE`](LICENSE)。免费用于商业和个人使用。
- [`CONTRIBUTING.md`](CONTRIBUTING.md) 中的贡献指南。
- [`CODE_OF_CONDUCT.md`](CODE_OF_CONDUCT.md) 中的行为准则。
- [`SECURITY.md`](SECURITY.md) 中的安全策略。
- GitHub 问题模板,用于错误报告、功能请求和优秀首发问题。
- 通过 GitHub Releases 发布和版本标签。
- [`public/`](public) 下的静态网站和文档。
良好的起始工作应该在 GitHub 上标记为 `good first issue`。存储库还包括一个良好的首发问题模板,以便可以在不丢失上下文的情况下创建小范围的任务。
## 安全模型
- Pixcode 是自托管的。像对待本地控制面板一样对待它。
- 在网络上公开时,请使用强大的本地帐户凭证。
- 将公共服务器部署放在受信任的反向代理、VPN 或防火墙后面。
- API 密钥用于自动化。如果密钥被公开,请轮换它们。
- 在可能的情况下,提供者秘密在 API 和 UI 响应中被掩盖。
- 不要发布包含提供者令牌、会话输出或私有项目路径的日志。
## 贡献
在打开拉取请求之前,请阅读 [`CONTRIBUTING.md`](CONTRIBUTING.md)。保持更改范围小,运行上述验证命令,并为 UI 工作提供截图或短录像(如果可能)。
有关社区行为期望,请阅读 [`CODE_OF_CONDUCT.md`](CODE_OF_CONDUCT.md)。有关私人漏洞报告,请阅读 [`SECURITY.md`](SECURITY.md)。
## 云(即将推出)
Pixcode Cloud 将提供一个完全托管的 SaaS 体验 — 无需服务器设置,无需 Docker,无需守护进程配置。连接您的 GitHub 仓库,选择 AI 编程代理,让它在我们为您管理的隔离容器中工作。
- **BYOK** (自带密钥)或使用我们的托管 API 池
- 每个项目的隔离 Docker 容器
- 团队协作和共享工作空间
- 成本分析和令牌使用仪表板
- 具有预建编排模板的工作流市场
在 [GitHub Discussions](https://github.com/alicomert/pixcode/discussions) 中加入讨论或请求早期访问。
## 链接
- 官网:<https://alicomert.github.io/pixcode/landing.html>
- npm:<https://www.npmjs.com/package/@pixelbyte-software/pixcode>
- GitHub:<https://github.com/alicomert/pixcode>
- 版本:<https://github.com/alicomert/pixcode/releases/latest>
- API 文档:[`public/openapi.yaml`](public/openapi.yaml)
- 静态文档:[`public/docs.html`](public/docs.html)、[`public/features.html`](public/features.html)、[`public/orchestration.html`](public/orchestration.html)、[`public/api-automation.html`](public/api-automation.html)
- AI 发现:[`public/llms.txt`](public/llms.txt)、[`public/llms-full.txt`](public/llms-full.txt)
Pixcode 是一个独立的开源项目,与 OpenAI、Anthropic、Google、Cursor、Alibaba/Qwen 或 OpenCode 无关。
连接信息
猜你喜欢
暂无推荐服务器