sebastienservouze/pi-livecraft

_{Just a silly example of live app modification}

## Pi 依然负责核心工作 Pi 管理着 providers、models、sessions、history、tools、commands 和 extensions。它负责推理、编写代码并运行 tools。 Livecraft 构建于其之上。 您只需像往常一样配置 Pi。Livecraft 只需调用它，而无需保留第二份 provider 或 model 配置。 ## 为什么选择 Livecraft？ **毫无疑问，Pi 已经在终端中提供了出色的体验。** 遗憾的是，终端（目前）还无法做到一切。对于受益于更大空间和交互性的部分，浏览器就显得非常方便：图表、小型按钮以及高级交互（图像、视频、3D？）。 例如，我嵌入了一个 **Session Analysis widget**，它可以让您实时监控使用情况、token 消耗和成本，还可以根据多种标准识别出最昂贵的 tool 调用。 是的，您当然可以！那么，将**所有这些数据通过图表展示**，并点击任意数据点以**跳转回对话中相应的轮次或 tool 调用**，以便进一步分析，又如何呢？ 直接在 tool 结果块中显示完全交互式的 HTML 页面怎么样？SVG 呢？渲染后的 Markdown 呢？在任务结束时撒花特效又如何呢？ *好吧，如果是这样，那 Livecraft 可能不适合您 :3* **关键在于**，UI 位于此代码仓库中，并由 Vite 进行热重载，同时保持所有 Pi sessions 处于活跃状态，因此模型可以在您使用它的**同时**对其进行修改。当界面中有令人烦恼的地方时，通常的流程是： 1. 要求模型进行修改 2. 实时观察修改效果 3. 从此以后就使用修改后的版本 项目中所有的文档（本 README 除外）主要供 agents 阅读（您依然可以阅读，别担心）。请从[文档索引](/docs/README.md)开始。 ## 快速开始 您需要 **Node.js 24+**、**npm** 以及一个配置好的 **Pi**。支持 Linux 和 WSL。 **[Fork 该仓库](https://github.com/sebastienservouze/pi-livecraft/fork)**，然后运行： ``` git clone https://github.com/YOUR-USERNAME/YOUR-REPOSITORY.git cd YOUR-REPOSITORY npm install npm run dev # this allows hot reloading ``` 打开 [http://127.0.0.1:5173](http://127.0.0.1:5173)，您应该就能看到 Livecraft。 ## 内置功能 ### 与 Pi 协同工作 - **Workspaces 和并行 sessions：** 跨多个 workspaces 创建、切换、重新打开并监控 Pi sessions。无论您身在何处，运行中和新完成的 sessions 始终在列表中可见 - **Pi 原生输入器：** 发送文本和图像，使用斜杠命令，停止请求，选择 Pi 提供的 models、思考级别和已保存的 prompts，并在 Pi 工作时引导或排队后续操作 - **Isolated prompts：** 从 widget、command 或任何地方运行一次性的 Pi prompt。默认情况下，它使用您 Pi 安装中最便宜的可用 model，返回一个答案，并且不会向当前对话添加任何内容 - **Extension 对话框：** 处理 Pi 的标准选择、确认、输入和编辑器请求，以及来自 Livecraft extensions 的结构化问卷 - **Livecraft 专属 Pi extensions：** 制作仅在配合 Livecraft 工作时才加载到 Pi 中的 extensions，以改善您的 Livecraft UX/UI。 ### 查看 Pi 正在做什么 - **实时对话：** 响应、活动、tool 执行、使用情况、成本、错误、更新、通知……我的意思是，Pi 发送的一切，Livecraft 都能看到 - **增强的 tool 调用渲染：** 允许进行复杂（或更简单）的 tool 调用渲染。例如，HTML、SVG 和 Markdown 将直接渲染，并且只需单击即可查看源代码（带有语法高亮） - **上下文聊天消息操作：** 在任何 tool 调用或 session 消息上构建按钮。一个例子是所有消息和 tool 调用结果中可用的嵌入式复制输入/输出操作 ### 将 workspace 工具置于手边 - **Session 分析：** 对 session 进行实时使用情况分析。所有数据均显示为交互式图表。点击任意点即可跳转回 session 中相应的轮次或 tool 调用。这是一个展示此处理论潜力的绝佳例子！ - **Todos：** 在 session 运行时添加任务，以免遗忘。一键即可将这些 todos 转化为真实的 sessions。它们按 workspace 持久化保存（我在开发 Livecraft 时大量使用了此功能） - **Git：** 在不离开对话的情况下查看状态、diffs、更改的文件和未推送的 commits；进行 commit、push、reset 或 revert - **Provider 配额：** 在一个面板中查看 OpenAI Codex 和 GitHub Copilot 的使用窗口（我只用这些，哈哈。欢迎添加您的 provider。） - **Terminal：** 从侧边栏、palette 或快捷方式在当前 workspace 中打开外部 Linux 或 WSL terminal ### 塑造工作台 - **可编辑的颜色主题：** 从浅色或深色开始，或者基于其中之一进行构建。agent 可以完成此操作，但为了节省您的 tokens，请手动编辑主题。选择一个基础主题，然后选择强调色和辅助色；其他一切都将由此派生。这样您就拥有了自己的主题 - **命令 palette 和可编辑的快捷键：** 命令共享一个注册表。侧边栏 widgets 会自动获取其命令。使用 `Alt+K` 显示命令 palette - **本地偏好设置：** 对话显示、workspace 恢复、快捷键、terminal 命令、面板大小和 widget 状态保存在浏览器中 - **灵活的布局：** 不喜欢侧边面板？**去掉**它们；您可以随心所欲 - **通知：** 常规通知会自动消失，错误通知会一直保留直到被忽略 ## 自定义你的应用 Pi Livecraft 的仓库是一个起点。**Forks 预期会偏离上游**，且没有要求保持它们同步。 使用它一段时间。当遇到阻碍时，要求模型进行修改，如果确实有帮助，就保留结果 :) 一些用来测试的合理初步修改： - 将重复的 prompt 或 workspace 命令变为一键操作； - 为重要的 Pi tool 提供一个与其输出相匹配的呈现方式； - 添加一个右侧边栏 widget，用于显示您反复寻找的上下文； - 将消息、表单和操作组合成重复性的工作流； - 移除所有您不使用的功能； - **添加一些客观上不必要，但主观上令人愉悦的功能** 上游保持保守，主要接受 bug 修复。新的工作流和产品选择应存在于需要它们的 forks 中。 ## 从哪里开始修改 上面的列表展示了现有的内容。下面的指南指出了修改应归属的位置，以及涵盖该修改的专项检查。 | 您想要... | 从这里开始 | | --- | --- | | 修改输入器 | [输入器指南](/docs/HOW-TO-COMPOSER.md) | | 为消息或 tool 调用添加操作 | [对话操作指南](/docs/HOW-TO-CONVERSATION-ACTION.md) | | 为 Pi tool 提供自定义呈现方式 | [Tool 呈现指南](/docs/HOW-TO-TOOL-PRESENTATION.md) | | 添加 palette 命令或快捷键 | [Palette 命令指南](/docs/HOW-TO-PALETTE-COMMAND.md) | | 添加设置或主题 | [设置指南](/docs/HOW-TO-SETTINGS.md) 和 [主题指南](/docs/HOW-TO-THEME.md) | | 添加侧边栏 widget | [Widget 指南](/docs/HOW-TO-WIDGET.md) 和 [widget 约定](/src/features/right-sidebar/README.md) | | 呈现来自 Pi extension 的 UI | [对话框约定](/src/features/dialogs/README.md) 和 [Pi extensions](/pi-extensions/README.md) | | 向 Pi 发送另一个命令 | [Pi RPC 指南](/docs/HOW-TO-TALK-TO-PI.md) | | 在不触及 session 的情况下运行 prompt | [Isolated prompt 指南](/docs/HOW-TO-RUN-ISOLATED-PROMPT.md) | | 了解浏览器、本地服务和 Pi 如何连接 | [架构指南](/docs/ARCHITECTURE.md) | [文档索引](/docs/README.md) 链接了功能约定、后端能力、widgets 以及每个界面背后的专项检查。 ## 给我的技术伙伴们，简而言之 一切都在本地运行！ 浏览器渲染应用程序。本地后端处理 Livecraft 功能，并将 Pi 的事件传回页面。 **独立的 manager 负责启动并拥有 Pi 进程**，因此刷新浏览器或重启后端都不会关闭它们，因为 manager 位于 Vite 热重载域之外。 ``` flowchart LR subgraph Livecraft["Pi Livecraft"] direction LR Browser(["React browser"]) Backend["Local backend"] Manager["Pi process manager"] Supervisor["Manager supervisor"] Browser <-->|"HTTP + SSE"| Backend Backend <-->|"Local JSON Lines"| Manager Supervisor -.->|"guarded lifecycle"| Manager end Manager <-->|"Pi public RPC"| Pi(["Pi
pi --mode rpc"]) ``` Vite 可以在 session 保持打开状态时更新前端。后端也可以在不关闭活跃 Pi 进程的情况下重启。 如果 manager 代码发生更改，Livecraft 会显示一个持久通知并等待。直到您提出请求且 Pi 处于空闲状态时，manager 才会被替换。在替换期间关闭的 sessions 在历史记录中仍然可用。这就是诀窍。很酷，对吧？ :) Manager 通过其公共 RPC 协议与 Pi 进行通信。Livecraft extensions 使用 Pi 的公共 extension API，因此一切尽在掌握。 Git、todos、terminal 启动和浏览器偏好设置仍然是本地的 Livecraft 功能。这里没有 Livecraft extension 系统，所以您可以尽情折腾（但也可能会搞坏一切）！ ## 可选的 Pi 额外组件 当这些 extensions 安装并配置在 Pi 中时，Livecraft 已经包含了它们的逻辑和 UI，因为它们就像是我 Pi 的苹果（天哪...） - **[@nerisma/pi-agents](https://github.com/sebastienservouze/pi-agents):** 添加专门的 agents，具有专注的 prompts、受限的 tool 集和隔离的委派。当 Pi 暴露 `/agent` 时，Livecraft 会显示一个 agent 选择器。 - **[@nerisma/pi-auto-title](https://github.com/sebastienservouze/pi-auto-title):** 从 sessions 的第一个 prompt 为其命名，这使得并行历史记录更易于浏览。

故障排除

- `pi: command not found`：全局安装 Pi，并验证在用于启动 Livecraft 的 shell 中 `pi --version` 是否有效。 - Manager 或后端不可用：检查端口 `43120` 和 `43121`，或设置 `PI_LIVECRAFT_MANAGER_PORT` 和 `PI_LIVECRAFT_BACKEND_PORT`。在 manager 崩溃后，重启 `npm run dev`；supervisor 有意不会自动重新启动它。 - 新 session 无法回答：启动一次 Pi，使用 `/login` 配置 provider，如果您的设置需要，请验证 `/agent` extension 是否可用。 - Linux 桌面操作不可用：安装或在 `PATH` 中暴露 `xdg-open` 和 `x-terminal-emulator`。 - WSL 桌面操作不可用：验证在 WSL 的 `PATH` 中是否可以使用 `explorer.exe`、`wslpath` 和 `wt.exe`。

开发检查

运行涵盖您更改的最小范围的检查。对于较大的更改，完整的本地检查集为： ``` npm run typecheck npm run lint npm test npm run build ``` Pi RPC 集成测试还需要一个已配置的 Pi 安装。

## 使用 Pi 打造，为 Pi 而生 ❤️ Pi 提供了 agent runtime、sessions、tools 和 extension 模型。它负责实际工作；Livecraft 是围绕它构建的本地 Web 界面。 ## 贡献 欢迎在上游提交有针对性的 bug 报告和 bug 修复。工作流功能应存在于需要它们的 forks 中。做您想做的吧！ ## 许可证 Pi Livecraft 基于 [MIT 许可证](/LICENSE) 发布。

标签：AI智能体, MITM代理, React, SOC Prime, Syscalls, 实时交互, 开发工具, 用户界面, 自动化攻击