VS Code 插件：在编辑器内运行 OpenCodeUI（第三方 OpenCode Web 前端）
插件激活
├── opencode serve --port 4096（API 后端）
└── OpenCodeUI Vite dev server --port 5173（前端）
└── Vite proxy /api/* → http://localhost:4096
└── Simple Browser / 浏览器打开 http://localhost:5173
通信链路：
- 插件启动
opencode serve作为 API 后端 - 插件同时启动 OpenCodeUI 的 Vite 开发服务器
- Vite 配置了
/api代理到opencode serve - VS Code Simple Browser 或系统浏览器打开 OpenCodeUI 界面
- 所有 AI 对话、会话管理、文件浏览等操作都在 OpenCodeUI 中完成
# 安装依赖
cd 工程样例/a2ui-opencode
npm install
# 编译
npm run compile
# 按 F5 启动 Extension Development Host
# 插件会自动启动 opencode serve + OpenCodeUI 并打开浏览器| 依赖 | 说明 |
|---|---|
| VS Code 1.80+ | 桌面版或 code-server |
| opencode CLI | AI 后端（需单独安装配置） |
| Node.js 18+ | 运行 Vite dev server |
| OpenCodeUI | 内置于 src/opencode-ui/（Vite 项目在 /tmp/OpenCodeUI） |
- 左侧边栏：会话列表（A2UI 图标）
- 编辑器区域：
simpleBrowser.api.open打开 OpenCodeUI - 快捷键：
Cmd+Shift+Alt+C/Ctrl+Shift+Alt+C打开 Chat - 会话管理、AI 对话、文件浏览、终端全部由 OpenCodeUI 提供
src/
├── extension.ts # 插件入口：启动 serve + Vite + 侧边栏
├── chat/
│ └── ChatPanelManager.ts # 管理 OpenCodeUI 生命周期
├── session/
│ ├── types.ts # 会话类型定义
│ ├── SessionStore.ts # 会话存储（本地 + 远程映射）
│ └── SessionListViewProvider.ts # 侧边栏会话列表
├── opencode/
│ └── OpencodeCLI.ts # opencode serve 进程管理 + SSE 事件流
└── opencode-ui/ # OpenCodeUI 构建产物（备用）
# 更新 OpenCodeUI 构建产物
cd /tmp/OpenCodeUI
git pull
npm install
npm run build
cp -r dist /path/to/a2ui-opencode/src/opencode-ui