1. 为什么要在 OpenCode 里折腾 drawio-skill 和 OMO 架构图如果你平时用 OpenCode 写代码大概率遇到过这种场景需求评审完老板说“给我画一张系统架构图”你打开 draw.io 拖了半小时方块连线还是歪的。更麻烦的是架构一变图就得重画。drawio-skill 就是来解决这个问题的——它是一套遵循 Agent Skills 格式的指令集让 AI 编程工具能直接调用 draw.io 桌面版 CLI把自然语言描述转成专业的 .drawio 图表支持架构图、流程图、ERD、UML、时序图等六种预设还能导出 PNG/SVG/PDF。而 OMOOhMyOpenCode是围绕 OpenCode 搭起来的一套 Agent 编排平台里面有 Sisyphus 编排引擎、Agent 集群、Skill/Tool/MCP 系统。把这两者结合起来你就能在 OpenCode 里用一句话生成 OMO 的分层架构图改完代码顺手更新图不用再手动对齐。这篇内容适合三类人一是用 OpenCode 做日常开发的工程师想把手绘图自动化二是搭 OMO 这类 Agent 平台的团队需要频繁输出架构文档三是刚接触 Agent Skills、想知道 drawio-skill 到底怎么落地的小白。我会从环境准备讲到可复制的配置片段再到生成一张 OMO 架构图并校验节点连线最后把 OpenCode 的 Base URL 切到 TaoToken 统一通道让 Key 和模型管理省心一点。核心检索词先摆出来drawio-skill 是什么、能做什么、适合谁。简单说它是一个让 AI 帮你画 draw.io 图的技能包适合所有需要频繁产出专业图表又不想手拖控件的开发者。下面按步骤来每一步都能跟着做。2. 前置准备drawio-skill 安装与 OpenCode 环境打通2.1 安装 draw.io 桌面版并验证 CLIdrawio-skill 本身不渲染图形它是指挥 AI 去调用 draw.io 桌面版的命令行接口。所以第一步是装 draw.io 桌面版。Windows 用户去 GitHub Releases 下载安装包我装到了D:\draw.io\draw.io.exe版本 30.0.2。macOS 用户可以用 Homebrew 装路径通常在/Applications/draw.io.app/Contents/MacOS/draw.io。装完先验证 CLI 能不能跑 D:\draw.io\draw.io.exe --version正常会输出类似30.0.2的版本号。如果报“不是内部或外部命令”说明路径不对去安装目录确认一下 exe 的实际位置。这一步别跳过后面所有导出都依赖这个路径。2.2 在 OpenCode 中加载 drawio-skillOpenCode 里 drawio-skill 通常预装在~/.config/opencode/skills/drawio-skill/目录下核心是一个SKILL.md文件里面定义了图表预设、自检规则、样式规范。你可以先确认目录存在ls ~/.config/opencode/skills/drawio-skill/应该能看到SKILL.md以及配套的脚本比如encode_drawio_url.py、repair_png.py。如果目录不存在从 drawio-skill 的仓库把整个文件夹拷进去即可。加载方式是在 OpenCode 会话里通过 skill 工具引用或者在配置里声明 skill 路径。2.3 把 OpenCode 的 Base URL 切到 TaoTokenOpenCode 默认可能走官方通道但如果你想统一管理 Key、切换模型可以把 Base URL 改到 TaoToken 的 API 通道。TaoToken 提供统一的 Key/API 入口兼容 OpenAI 风格的请求格式。官网地址是 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content API 根地址是 https://taotoken.net/api 。在 OpenCode 的配置文件里找到 provider 或 model 相关段落把 baseURL 指向 TaoTokenapiKey 填你在控制台生成的 Key。具体字段名不同版本可能略有差异但核心三件套是Base URL、API Key、Model ID。这三样填全OpenCode 才能正常发请求。2.4 确认模型可用切完通道后先在 OpenCode 里发一条最简单的对话请求确认模型能返回内容。如果返回 401说明 Key 没填对或没生效如果返回 model not found说明 Model ID 写错了。这一步过了再进 drawio-skill 的实战否则后面报错你分不清是图的问题还是通道的问题。3. 可复制配置drawio-skill 片段与 OpenCode Base URL 填写3.1 drawio-skill 的 SKILL.md 关键配置drawio-skill 的行为由SKILL.md驱动里面最值得关注的是图表预设和自检开关。下面是一段可参考的配置结构路径与原文一致放在~/.config/opencode/skills/drawio-skill/SKILL.md--- name: drawio-skill description: 将自然语言转为 draw.io 图表并导出 version: 1.0.0 presets: - architecture - erd - uml-class - sequence - ml-model - flowchart self_check: enabled: true max_rounds: 2 checks: - overlap - label_clip - broken_edge style: font: Helvetica palette: default export: format: png scale: 2 embed_xml: true ---这里self_check是 drawio-skill 的亮点导出 PNG 后自动检测重叠、标签裁剪、连线断裂最多修两轮。embed_xml: true对应导出命令的-e参数让 PNG 里嵌 XML方便后续在 draw.io 里重新打开编辑。3.2 OpenCode 侧 Base URL 与鉴权字段示例OpenCode 的配置通常是一个 JSON 或 TOML 文件。以 JSON 为例把 provider 指向 TaoToken{ provider: { taotoken: { baseURL: https://taotoken.net/api, apiKey: sk-你的TaoToken密钥, model: deepseek-v4 } }, defaultModel: taotoken/deepseek-v4 }如果你用的是 TOML 格式等价写法[provider.taotoken] baseURL https://taotoken.net/api apiKey sk-你的TaoToken密钥 model deepseek-v4 [default] model taotoken/deepseek-v4注意 Base URL 只写到/api不要在后面拼/v1/chat/completionsOpenCode 会自己补路径。API Key 从 TaoToken 控制台生成别硬编码到公开仓库里用环境变量注入更稳export TAOTOKEN_API_KEYsk-你的密钥然后在配置里引用apiKey: ${TAOTOKEN_API_KEY}。3.3 三件套对照表字段值说明Base URLhttps://taotoken.net/api统一 API 入口不加 UTMAPI Keysk-xxx控制台生成环境变量注入Model IDdeepseek-v4按需换成其他可用模型这三样填全OpenCode 才能把请求发到 TaoToken 并拿到模型响应。drawio-skill 生成 XML 的过程依赖模型理解你的自然语言描述所以模型通道必须先通。3.4 导出命令模板drawio-skill 最终会调用 draw.io CLI 导出命令模板如下 D:\draw.io\draw.io.exe -x -f png -s 2 -e -o output.png input.drawio参数含义-x导出-f png指定格式-s 2缩放两倍-e嵌入 XML-o输出路径。如果你只是快速预览不要加-e因为嵌入 XML 会导致 PNG 的 IEND 块截断某些 Vision API 读图时会报 400。最终产出再加-e并用repair_png.py修复 IEND。4. 验证请求生成一张 OMO 架构图并校验节点连线4.1 用自然语言描述 OMO 架构在 OpenCode 会话里直接给 drawio-skill 一段描述画一张 OpenCode 和 OMO 的整体架构图分五层用户交互层放 Terminal CLI、TUI、API Web UIOpenCode 核心层放会话管理器、命令路由器、工具调度器、上下文管理器OMO Agent 平台层放 Sisyphus 编排引擎、Agent 集群build/explore/librarian/oracle/metis、Skill/Tool/MCP 系统AI 模型层放 DeepSeek V4 和 Claude基础设施层放文件系统、Git、Chrome、Node.js。用 swimlane 容器分层每层不同颜色。drawio-skill 会按 Architecture 预设生成 draw.io XML用 swimlane 容器构建各层。核心结构类似mxCell idt1 value用户交互层 styleswimlane;startSize35;fillColor#e1d5e7; vertex1 parent1 mxGeometry x40 y40 width1320 height130 asgeometry/ /mxCell五层颜色建议用户交互层紫色#e1d5e7OpenCode 核心层蓝色#dae8fcOMO Agent 平台层绿色#d5e8d4AI 模型层橙色#ffe6cc基础设施层灰色#f5f5f5。颜色不是随便选的分层配色能让读者一眼区分职责边界。4.2 导出 PNG 并检查文件生成opencode-omo-architecture.drawio后执行导出 D:\draw.io\draw.io.exe -x -f png -s 2 -e -o opencode-omo-architecture.png opencode-omo-architecture.drawio导出完成后先看文件大小。如果只有几 KB大概率是空图或渲染失败正常分层架构图带文字PNG 至少几十 KB。再用图片查看器打开肉眼扫一遍五层容器是否都在、每层标题是否显示、节点有没有重叠、连线有没有穿过文字。4.3 校验节点与连线是否正确drawio-skill 的自检会跑重叠、标签裁剪、连线断裂三项。但机器检测之外你还要人工核对业务语义。我一般按这个清单过一遍第一节点数量对不对。用户交互层 3 个、核心层 4 个、平台层 3 组、模型层 2 个、基础设施层 4 个数一遍别漏。第二连线方向对不对。比如“会话管理器 → 命令路由器 → 工具调度器”这条链箭头要从左到右别反向。第三跨层连线有没有断。OMO Agent 平台层调用 AI 模型层的线如果断在容器边缘说明连线锚点没设好。如果发现重叠让 drawio-skill 再跑一轮修复或者手动在 draw.io 里微调坐标。自检最多两轮两轮还修不好就手动介入别死等。4.4 用 encode_drawio_url.py 快速预览CLI 导出慢是公认的因为 draw.io 桌面版基于 Electron每次调用都要启动 Chromium 渲染Windows 上启动就要 3 到 8 秒。如果只是想快速看效果用encode_drawio_url.py生成 diagrams.net URL浏览器打开秒开python encode_drawio_url.py opencode-omo-architecture.drawio输出的 URL 贴到浏览器diagrams.net 会直接加载你的图。确认布局没问题后再走 CLI 导出最终 PNG。这样能省掉反复启动 Electron 的时间。4.5 验证模型通道是否真的走了 TaoToken生成图的过程中OpenCode 要把你的自然语言描述发给模型模型返回 XML 结构。你可以在 TaoToken 控制台看请求日志确认有对应的调用记录。如果日志为空说明 OpenCode 还在走默认通道回去检查 Base URL 和 API Key 是否生效。这一步是很多人忽略的——图生成了但用的是别的通道Key 管理就白切了。5. 本篇常见错排查401、local proxy failed、reading choices、OAuth5.1 401 Unauthorized最常见的报错。原因通常是 API Key 没填、填错、或者环境变量没导出。排查顺序先确认TAOTOKEN_API_KEY在当前 shell 里能echo出来再确认配置文件里引用的是${TAOTOKEN_API_KEY}而不是字面量最后去 TaoToken 控制台看 Key 是否被禁用或过期。如果 Key 是对的还报 401检查 Base URL 有没有多写斜杠或路径。5.2 local proxy failed这个报错一般出现在 OpenCode 尝试走本地代理但代理没起来的时候。如果你没配代理检查配置里有没有残留的 proxy 字段删掉即可。如果你确实需要网络转发确保本地服务在监听。注意这里说的是本地开发环境的端口转发不是任何绕过网络管理的手段合规使用。5.3 reading choices 报错这个报错通常出现在模型返回结构不符合预期时。OpenCode 期望返回里有choices数组但拿到的可能是错误对象或空响应。排查先用 curl 直接打 TaoToken 的 API确认返回结构正常curl -s https://taotoken.net/api/chat/completions \ -H Authorization: Bearer $TAOTOKEN_API_KEY \ -H Content-Type: application/json \ -d {model:deepseek-v4,messages:[{role:user,content:hi}]}如果 curl 返回正常但 OpenCode 报 reading choices说明 OpenCode 的解析层和返回格式不匹配检查 Model ID 是否写错或者换一个模型试试。5.4 OAuth 相关报错有些工具默认走 OAuth 登录流程切到 API Key 模式后如果还残留 OAuth 配置会报 token 无效。解决办法是在配置里显式关闭 OAuth只保留 apiKey 字段。如果工具同时支持两种模式确认 defaultModel 指向的是 API Key 对应的 provider。5.5 draw.io CLI 导出失败如果报“找不到 draw.io.exe”检查路径里的空格和反斜杠。Windows 路径用双引号包起来比如 D:\draw.io\draw.io.exe。如果报渲染超时把-s缩放从 2 降到 1 试试大图高缩放会拖慢渲染。如果 PNG 打不开用repair_png.py修 IEND 截断python repair_png.py opencode-omo-architecture.png5.6 节点重叠或连线错乱自检跑完还重叠多半是容器高度不够。手动把 swimlane 的 height 调大或者减少同层节点数量。连线错乱通常是锚点没设在 XML 里给 edge 加source和target的 id别让 draw.io 自动猜。6. 语义一致 CTA把通道和技能都落到日常drawio-skill 加 OpenCode 加 TaoToken 这套组合核心价值是让架构图跟着代码走。你改完 OMO 的 Agent 集群顺手让 drawio-skill 重生成一版图就不会和代码脱节。通道切到 TaoToken 之后Key 和模型集中管理换模型不用改一堆配置。如果你在排障或接入阶段卡住了先去 TaoToken 控制台生成 API Key再对照接入文档把 Base URL 和 Model ID 填对API Keys 页面在 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 。想先验证模型通不通用模型对话页面发一条测试请求https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 。如果你长期用 OpenCode 做编码和 Agent 编排Coding Plan 更适合统一管理额度https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 。最后留一个我踩过的坑draw.io CLI 导出慢的时候别反复重试先用 URL 预览确认布局再一次性导出。还有-e参数只在最终产出时加中间预览别加省得被 IEND 截断折腾。图生成完记得把 .drawio 源文件一起提交到仓库下次改架构直接改源文件重导出比从 PNG 反推快得多。