Pi Web 中文文档:功能丰富、操作便捷的 pi 编码助手本地 Web 用户界面

Pi Web 中文文档:功能丰富、操作便捷的 pi 编码助手本地 Web 用户界面 Pi Web 中文文档Pi Web 是 pi 编码助手的本地 Web 用户界面。它会读取你本地的 pi 会话文件为你提供一个基于浏览器的工作空间支持会话浏览、实时聊天、模型配置、技能管理以及项目文件预览等功能。在命令行界面CLI和 Pi Web 中同一个 pi 会话具备以下特点结构化的工具调用、易读的 Markdown 格式、会话浏览功能以及更清晰的结果展示。快速开始- 免安装运行npx agegr/pi-weblatest- 全局安装npm install -g agegr/pi-web然后运行 pi-web接着打开 http://localhost:30141。服务器就绪后命令行界面会尝试自动打开浏览器。选项- pi-web --port 8080自定义端口。- pi-web --hostname 127.0.0.1仅允许本地访问。- pi-web -p 8080 -H 127.0.0.1组合使用选项。- pi-web --no-open不自动打开浏览器。- PORT8080 pi-web也支持使用环境变量。- PI_WEB_NO_OPEN1 pi-web在作为后台服务运行时很有用。功能- 恢复工作按项目浏览之前的 pi 对话无需在终端历史记录或会话路径中查找。- 安全尝试不同方向从之前的消息继续或将会话分叉到单独的路径。- 跨分支工作通过侧边栏切换 Git 工作树新会话和资源管理器会跟随你选择的检出状态。- 在项目旁聊天在代理工作时左侧浏览文件右侧预览源代码、文档、图像、音频和 PDF。- 清晰查看会话状态从顶部栏可以看到上下文使用情况、成本、压缩状态和系统提示详情。- 减少在终端的配置操作通过 Web 用户界面管理模型、登录/API 密钥、模型测试和技能开关。注意事项- 数据目录Pi Web 默认读取 ~/.pi/agent/sessions。可以设置 PI_CODING_AGENT_DIR 指向其他 pi 代理目录。- 会话文件文件存储为 ~/.pi/agent/sessions//_.jsonl。- 模型配置模型面板会读取和写入 pi 代理目录中的 models.json。模型列表和默认设置来自 pi 的配置。- 文件访问文件浏览和预览范围限定于所选项目目录和会话中出现的工作目录。- Git 工作树关于切换器何时出现、如何创建新工作树以及删除操作的效果请参考 Pi Web 中的“工作树”部分。- 分叉与会话内分支分叉会创建一个新的 .jsonl 文件“从此处编辑”会在同一会话文件内创建另一个分支。开发- 安装依赖npm install- 启动开发服务器npm run dev本地开发服务器运行在 http://localhost:30141。常见检查- node_modules/.bin/tsc --noEmit- npm run lint在本地开发期间避免运行 next build 或 npm run build因为它们会写入 .next/ 目录可能干扰开发服务器构建操作应留到发布时进行。项目结构- app/- api/- agent/创建/驱动 AgentSession 并暴露服务器发送事件SSE。- auth/OAuth 和 API 密钥管理。- cwd/validate/自定义工作目录验证。- default-cwd/pi 默认工作目录查找。- files/文件列表、读取、预览和监控。- home/当前用户主目录。- models/可用模型、默认模型、思考级别。- models-config/读取/写入 models.json 并测试模型。- sessions/会话读取、重命名、删除、上下文、HTML 导出。- skills/技能列表、搜索、安装、启用/禁用。- components/- AppShell.tsx主布局、URL 状态、顶部面板、文件标签。- SessionSidebar.tsx项目选择器、会话树、资源管理器。- ChatWindow.tsx消息、SSE、图像拖放、小地图。- ChatInput.tsx输入栏、模型/工具/思考/压缩/斜杠控制。- MessageView.tsx消息、思考、工具调用/结果渲染。- ModelsConfig.tsx模型和认证配置面板。- SkillsConfig.tsx技能管理面板。- FileExplorer.tsx文件树。- FileViewer.tsx源代码、差异、图像、音频、PDF、DOCX 预览。- lib/- rpc-manager.tsAgentSessionWrapper 生命周期和全局注册表。- session-reader.ts解析 .jsonl 会话文件和分支上下文。- normalize.ts规范化工具调用字段名称。- file-access.ts文件读取安全边界。- file-paths.ts路径编码和相对路径辅助工具。- markdown.tsMarkdown/Mermaid/KaTeX 插件配置。- pi-types.ts与 pi 相关的类型。- hooks/- useAgentSession.ts会话加载、命令发送、SSE 状态机。- useAudio.ts完成音效。- useDragDrop.ts图像拖放。- useTheme.ts主题切换。- bin/- pi-web.jsnpm 命令行界面入口点。