Skip to content

Repository files navigation

opencode-config (ocs)

一个基于 Tauri 2 的桌面 GUI 工具,用于可视化管理 opencode 的配置文件(opencode.json / opencode.jsonc)。

项目仓库:https://github.com/ackwrap/opencode-config

直接读写 ~/.config/opencode/opencode.json,保存前自动创建带时间戳的备份,写入采用「临时文件 + 重命名」原子方式,避免写一半损坏配置。支持 JSONC 注释(///* */),读取时自动剥离注释后解析。

预览

opencode-config 界面预览

功能

应用左侧边栏提供 11 个配置分区,覆盖 opencode schema 中的绝大部分配置项:

常规 — 主模型(model)、轻量模型(small_model)、用户名(username)、默认 Agent(default_agent)、分享模式(share)、文件快照(snapshot)、自动更新(autoupdate)、Shell(shell)、日志级别(logLevel)、自定义指令文件(instructions

供应商provider.* 的完整增删改查,支持“覆盖 OpenCode 内置供应商”和“自定义供应商”两种方式;内置覆盖可只修改 Base URL、API Key、User-Agent 等 options,无需重复配置 NPM 包和模型,自定义供应商则可配置 AI SDK 包及完整模型列表

模型 — 选择活跃的主模型和轻量模型,按供应商分组浏览所有可用模型,支持 disabled_providersenabled_providers 过滤

Agentagent.* 的完整增删改查,可配置模型、模式(primary/subagent/all)、描述、Prompt 文件路径、温度、Top P、最大步数、禁用/隐藏状态

MCPmcp.* 的完整增删改查,支持本地(command + environment)和远程(URL + headers)两种类型,可配置工作目录、超时、启用/禁用

命令command.* 的完整增删改查,可配置提示词模板、描述、关联 Agent、模型、是否作为子任务运行

权限 — 支持全局策略(allow/ask/deny)和分类配置两种模式,覆盖 13 个权限类别:读取、编辑、文件搜索、内容搜索、执行命令、任务管理、技能调用、语言服务、向用户提问、网页抓取、网络搜索、外部目录、循环检测

压缩 — 上下文压缩设置,包括自动压缩(compaction.auto)、修剪旧工具输出(compaction.prune)、保留轮次数(tail_turns)、保留 Token 数(preserve_recent_tokens)、预留 Token(reserved

插件plugin[] 数组管理,支持 npm 包名、本地文件路径和带选项条目,拖拽调整外部插件顺序;内置 UA 请求头覆盖插件固定展示、不可删除,可独立启用或停用

引用references.* 的完整增删改查,支持 Git 仓库(含分支)、本地目录路径、纯字符串三种类型

高级 — 包含 8 个子分区:

  • 服务器:端口、主机名、mDNS 发现、CORS 域名
  • 格式化器:启用/禁用 + 自定义格式化命令和扩展名
  • LSP:启用/禁用 + 自定义语言服务器命令和扩展名
  • 附件:图片自动调整大小、最大宽高、最大 Base64 字节数
  • 工具输出:最大行数和字节数截断阈值
  • 实验性:批量工具、OpenTelemetry、拒绝时继续循环、禁用粘贴摘要、MCP 超时、主要工具列表
  • 文件监听:忽略模式列表
  • 技能路径:额外的技能文件夹路径和 URL

技术栈

技术
前端框架 React 18 + TypeScript 5.6
构建工具 Vite 6
样式 Tailwind CSS 3(暗色主题)
桌面框架 Tauri 2
后端语言 Rust(edition 2021)
依赖管理 bun(前端)+ Cargo(后端)
序列化 serde + serde_json
配置解析 自定义 JSONC 注释剥离器

前置要求

快速开始

# 克隆项目
git clone https://github.com/ackwrap/opencode-config.git
cd opencode-config

# 安装前端依赖
bun install

# 开发模式(启动 Vite dev server + Tauri 窗口)
bun run tauri:dev

# 仅前端开发(浏览器中预览,无 Tauri 后端)
bun run dev

开发模式下 Tauri 窗口会连接 http://localhost:1420 的 Vite dev server,支持前端热更新。

构建与打包

# 仅构建前端(输出到 dist/)
bun run build

# 类型检查(不产出文件)
bun run x tsc --noEmit
# 或直接运行
node_modules/.bin/tsc --noEmit

# 构建桌面应用安装包(先 build 前端,再编译 Rust,输出 NSIS 安装程序)
bun run tauri:build

tauri:build 会在 src-tauri/target/release/bundle/ 下生成 Windows NSIS 安装包(.exe)。

架构概览

用户界面 (React)
    │
    │  invoke("load_config_cmd") / invoke("save_config_cmd")
    │  通过 @tauri-apps/api/core 的 invoke 调用
    ▼
Tauri 命令层 (Rust)
    │  commands.rs — 配置读写、模型/供应商目录获取、受管插件文件命令
    │  config.rs   — 配置路径解析、JSONC 注释剥离、原子写入
    │  types.rs    — OpencodeConfig (serde_json::Value 透明包装)
    ▼
文件系统
    ~/.config/opencode/opencode.json
    ~/.config/opencode/opencode.jsonc (备选)
    ~/.config/opencode/.ocs-backups/  (自动备份)
    ~/.config/opencode/opencode-config/plugins/  (应用内置插件)

后端只处理必须依赖文件系统、Tauri 或网络的能力,包括配置读写、模型列表请求、Models.dev 供应商目录请求和受管插件文件部署;普通配置 CRUD、表单验证和 UI 状态仍由前端的 useConfigStore hook 处理。供应商目录会在进程内缓存,用于确认“覆盖内置供应商”的 Provider ID。配置类型是 serde_json::Value 的透明包装,不丢弃任何未知字段,保证往返一致性。

前端状态管理

核心 hook 是 useConfigStore,提供基于点号路径的泛型 JSON 操作:

const { config, get, set, remove, save, dirty, loading, saving } = useConfigStore();

get("provider.openai.options.apiKey");     // 读取嵌套值
set("provider.openai.options.apiKey", val); // 设置嵌套值(自动标记 dirty)
remove("provider.openai.disabled");         // 删除嵌套值
save();                                      // 保存到磁盘(Ctrl+S 也触发)

所有配置分区组件接收 store: ConfigStore prop,通过 get/set/remove 直接操作 JSON 配置树。

项目结构

opencode-config/
├── src/                          # 前端源码
│   ├── main.tsx                  # React 入口
│   ├── App.tsx                   # 主组件(Sidebar + 分区路由 + StatusBar)
│   ├── types.ts                  # 类型定义(Section、OpencodeConfig 等)
│   ├── index.css                 # 全局样式 + Tailwind 指令
│   ├── lib/
│   │   └── commands.ts           # Tauri invoke 封装
│   ├── hooks/
│   │   └── useConfigStore.ts     # 核心 hook:配置加载/保存/CRUD
│   └── components/
│       ├── Sidebar.tsx           # 左侧导航栏(11 个分区)
│       ├── StatusBar.tsx         # 底部状态栏(路径 + dirty + 保存)
│       ├── GeneralSettings.tsx   # 常规设置
│       ├── ProviderList.tsx      # 供应商列表
│       ├── ProviderForm.tsx      # 供应商添加/编辑弹窗
│       ├── ModelList.tsx          # 模型选择 + 供应商过滤
│       ├── AgentManager.tsx      # Agent 管理
│       ├── McpManager.tsx        # MCP 服务器管理
│       ├── CommandManager.tsx    # 斜杠命令管理
│       ├── PermissionEditor.tsx  # 权限策略编辑
│       ├── CompactionSettings.tsx # 压缩设置
│       ├── PluginManager.tsx     # 外部插件排序 + 内置插件启停
│       ├── ReferencesManager.tsx # 引用管理
│       ├── AdvancedSettings.tsx  # 高级设置(8 个子分区)
│       ├── ConfirmDialog.tsx     # 确认删除弹窗
│       └── ui/
│           ├── FormField.tsx     # 标签 + 提示 + 子元素
│           ├── SectionCard.tsx   # 卡片区块
│           ├── Toggle.tsx        # 开关组件
│           └── KeyValueEditor.tsx # 键值对编辑器
├── src-tauri/                    # Rust 后端源码
│   ├── Cargo.toml                # Rust 依赖
│   ├── tauri.conf.json          # Tauri 配置(窗口、打包)
│   ├── build.rs                 # Tauri 构建脚本
│   ├── capabilities/
│   │   └── default.json         # Tauri 权限配置
│   └── src/
│       ├── main.rs              # 入口(调用 lib::run)
│       ├── lib.rs               # Tauri builder + 命令注册
│       ├── commands.rs          # 配置、模型请求、受管插件命令
│       ├── config.rs            # 配置与插件路径 + JSONC 剥离 + 原子写入
│       └── types.rs             # OpencodeConfig / LoadResult 类型
├── index.html                   # HTML 入口
├── package.json                 # 前端依赖与脚本
├── tsconfig.json                # TypeScript 配置
├── vite.config.ts               # Vite 配置
├── tailwind.config.js           # Tailwind 主题色定义
└── postcss.config.js            # PostCSS 插件

配置文件处理

应用先确定配置目录:设置了 $XDG_CONFIG_HOME 时使用 $XDG_CONFIG_HOME/opencode/,否则使用 ~/.config/opencode/。随后优先读取该目录下的 opencode.json,不存在时再读取 opencode.jsonc

读取时自动剥离 JSONC 注释(// 行注释和 /* */ 块注释),字符串内部不受影响。保存时统一输出为格式化的 JSON(serde_json::to_string_pretty)。

每次保存前,在 ~/.config/opencode/.ocs-backups/ 目录下创建一份带时间戳的备份文件(如 opencode.2026-06-23T14-30-00.json),然后通过「写入临时文件 → 重命名」的方式原子替换原文件。

内置 UA 插件保存在配置目录的 opencode-config/plugins/ 子目录,避免被 OpenCode 的全局 plugins/ 目录自动加载。应用通过 plugin[] 中的相对路径和插件 options 控制启停;旧版自动加载文件只会在新配置成功保存且确认由本应用生成后改名归档,不会永久删除。

说明

  • API Key 建议使用 {env:YOUR_KEY} 语法,由环境变量注入,避免明文写入配置文件。
  • 保存操作可通过 Ctrl+S(macOS 上 Cmd+S)快捷键触发,也可点击底部状态栏的「保存」按钮。
  • 底部状态栏会显示配置文件路径、未保存指示器、以及保存状态反馈。
  • 窗口默认尺寸 900×650,可调整大小。
  • 暗色主题,配色基于自定义 Tailwind 色板(背景 #0f1117,强调色 #6c7bff)。

About

A sleek Tauri 2 & React desktop GUI for managing opencode configurations with auto-backups and atomic writes. 基于 Tauri 2 的 opencode 配置可视化桌面管理工具。

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Used by

Contributors

Languages