前言¶
在 DeepSeek Harness（DSH）里写计划或评审文档时，Markdown 里常夹 PlantUML 代码块。若预览只能显示源码，评审者要另开 Java、PlantUML 服务或在线渲染页面，图与正文容易脱节，迭代时也容易留下过期截图。
dsh-sidebar-plantuml 面向 DSH Web 客户端右侧边栏的 Markdown 预览：把 plantuml 等代码块在浏览器里直接画成可交互 SVG，不依赖 Java、不访问 PlantUML 服务端、渲染过程不发起额外网络请求。下面介绍插件定位、能力、安装与使用方式；事实以 GitHub 仓库 README 与 npm 包为准。
这是什么¶
- 名称：
dsh-sidebar-plantuml（npm 包名与插件 id 一致） - 维护者：j20cc（基于 dlutcat/dsh-plantuml 的 MIT fork，针对侧边栏场景重新打包）
- 分类：客户端（
dsh.client.platform为web） - 当前版本：0.1.0（见 npm /
package.json） - 许可证：MIT（保留 dlutcat 原作者信息；fork 修改与打包 © 2026 j20cc）
插件是独立的 DSH 插件（npm 包 + host/browser 两端），安装后挂载到 profile 的 loader，不依赖 dsh-better-sidebar 或其他第三方侧边栏插件。
核心功能¶
代码块识别与渲染范围¶
- 支持语言标记为
plantuml、puml、uml、iuml、pu、wsd的围栏代码块。 - 无语言标记但内容包含完整
@start…/@end…对的代码块也会被识别（启发式，见下文注意项）。 - 可在以下位置的 Markdown 代码块中渲染：侧边栏内置 Markdown 预览、
dsh-better-sidebar的预览、聊天区域、工具结果中的 Markdown。
交互与主题¶
每个代码块提供：
- 「图片 / 代码」切换、复制源码、全屏查看（缩放、拖动）、下载 SVG/PNG。
- 跟随浅色/深色主题重新渲染。
引擎与离线特性¶
- 使用 TeaVM 编译的 PlantUML 引擎，在浏览器本地运行， bundled 标准库（
vendor/plantuml.js、vendor/stdlib/*来自 PlantUML 官方 plantuml-for-github MIT 构建）。 - 单张图渲染上限约 20 秒，超时显示错误，避免卡住整个预览。
安装与启用¶
插件以当前 DSH profile 与 Web 进程权限运行；安装前建议浏览仓库源码与 LICENSE、NOTICE.md。
Node 引擎要求：>=20（见 package.json）。
从 npm 安装（推荐）¶
dsh plugin --profile web add dsh-sidebar-plantuml
从 GitHub 安装¶
dsh plugin --profile web add github:j20cc/dsh-sidebar-plantuml
或使用 Git URL：
dsh plugin --profile web add https://github.com/j20cc/dsh-sidebar-plantuml.git
已发布版本 tarball（v0.1.0）：
dsh plugin --profile web add https://github.com/j20cc/dsh-sidebar-plantuml/releases/download/v0.1.0/dsh-sidebar-plantuml-0.1.0.tgz
从本地目录安装¶
dsh plugin --profile web add file:/absolute/path/to/dsh-sidebar-plantuml
安装后重启 dsh web（或让当前 profile 的 HMR 重新加载），刷新页面即可。
包内带有 cordis.patch.yml 和 dsh.bundle.patch，一般 dsh plugin add 会自动处理。若 profile 未自动加载插件，可在 ~/.dsh/profiles/<profile>/cordis.patch.yml 手工插入：
- insert:
- id: dsh-sidebar-plantuml
name: 'dsh-sidebar-plantuml'
典型用法¶
在侧边栏打开 Markdown 文件，写入 PlantUML 围栏块并保存：
```plantuml
@startuml
Alice -> Bob: hello
Bob --> Alice: hi
@enduml
```
保存后预览区显示 SVG；代码块上方的「图片 / 代码」可随时切回源码。
计划文档里也可以用更完整的时序图描述 DSH 与插件的协作关系，例如 README 中的示例（打开计划 → 渲染代码块 → 侧边栏展示 SVG）。
适用场景与注意¶
适合谁¶
- 在 DSH Web 侧边栏写 AI 计划、架构说明、评审材料，希望图与 Markdown 同源、可 diff、可版本化。
- 需要 类图、组件图、时序图、状态图 等 UML 语义，又不想维护 draw.io 导出或 PlantUML 服务端。
- 网络受限或不想把图源传到外部渲染服务时，需要 纯浏览器本地 出图。
PlantUML 是纯文本 DSL，便于 LLM 生成与修改；改一行即可重渲染，比静态截图更适合迭代。
注意事项¶
- 与旧插件冲突：若同时安装
dsh-plantuml（同一上游的旧名），两个插件会重复接管相同代码块；应先移除旧插件再装本插件。 - 启发式识别：普通代码块若碰巧含匹配的
@start…/@end…，也会被当作 PlantUML；点「代码」可查看原文。 - 超时：单图最长约 20 秒，超限报错。
- 安全与信任：插件在 DSH Web 客户端内执行；安装前请自行核对 j20cc/dsh-sidebar-plantuml 源码与第三方 NOTICE。
结尾¶
dsh-sidebar-plantuml 把 PlantUML 预览收进 DSH 侧边栏 Markdown 流程：无需 Java 与远程 PlantUML 服务，在浏览器里出可缩放、可下载的 SVG，适合把计划里的结构关系直接画进同一份文档。
DSH 生态理念是「一切皆插件」；SkillHub 等目录为社区站点，与 DeepSeek / 幻方无官方从属关系。
