前言¶
在 DeepSeek Harness（DSH）里和模型对话时，架构说明、流程梳理、时序关系往往以 Markdown 里的 ```mermaid 代码块形式出现。Harness 默认只会把这些块当普通代码展示，读者需要自己复制到外部编辑器或在线工具才能看图。若希望「模型照旧输出 Mermaid、界面里直接变成图」，且不想依赖额外服务端，就需要在客户端侧做增强。下面介绍社区插件 dsh-flowchart（维护者 jesongit，分类：客户端），它把聊天中的 Mermaid 块就地渲染为可缩放、可导出、可全屏的交互式图表。
这是什么¶
dsh-flowchart 是 DeepSeek Harness 的客户端插件：自动识别对话里的 Mermaid 代码块（历史消息与新消息均生效），在浏览器本地渲染成图表。渲染与 Mermaid 引擎均在本机完成，不联网、不上传内容。插件当前版本为 1.0.2（见仓库 package.json），许可证 MIT。
核心功能¶
依据仓库 README，能力包括：
- 自动渲染：识别
```mermaid围栏，就地替换为图表视图；渲染失败时降级为原始代码块，不影响其它消息。 - 工具栏：放大、缩小、适应页面、复制图片、下载 SVG、全屏、源码切换。
- 复制图片：图表视图下以 2× 分辨率导出 PNG 到剪贴板，可粘贴到 QQ、微信等；源码视图下复制 Mermaid 源码。
- 全屏：滚轮以鼠标位置为中心缩放，左键拖动平移，
Esc退出。 - 主题：跟随 Harness 明/暗主题自动重渲染。
- 体积与加载：Mermaid 引擎（约 1MB gzip）独立分块懒加载，首次出现图表时才下载；基础插件体积较小。
支持的图种（Mermaid 11 主流类型）：流程图、时序图、类图、状态图、ER 图、甘特图、饼图、Journey、Git 图、思维导图、时间线、象限图、Sankey、xychart、block、C4 等。
安装与启用¶
前提：已安装 DeepSeek Harness，且启用插件管理器。
从 GitHub 安装（README 原文命令）：
dsh plugin add github:jesongit/dsh-flowchart
README 说明：目前未发布到 npm；发布后可使用 dsh plugin add dsh-flowchart。本地开发时可用 dsh plugin add ./dsh-flowchart（需自行 clone 仓库，本文不展开）。
安装后在 设置 → 插件 中应能看到「Mermaid 图表 / Mermaid Diagrams」。首次对话里出现 Mermaid 块时会自动加载 Mermaid 引擎。
DSH 生态采用「一切皆插件」思路；插件目录站点 skillhub.cn 为社区收录，与 DeepSeek / 幻方无官方从属关系。
典型用法¶
无需改模型提示词习惯，在消息里发送标准 Mermaid 围栏即可。示例（来自 README）：
```mermaid
flowchart LR
A[提问] --> B{是否 Mermaid}
B -->|是| C[渲染成图]
B -->|否| D[普通代码块]
```
发送后，插件会在已渲染的对话 DOM 上增强对应代码块；若未来 Harness 的 DOM 结构变化导致匹配失败，会保持原始代码块显示。
适用场景与注意¶
适合：在 DSH 内做方案评审、写技术文档式对话、让 Agent 输出流程图/时序图/类图等并直接在界面阅读与分享 PNG/SVG 的场景。
实现与限制（README 说明）：
- Harness 的 Markdown 渲染器没有代码围栏的插件钩子，本插件通过观察已渲染 DOM 增强代码块，对 DOM 变更有耦合。
- 超宽或超大图会等比缩小以适应一屏；细节可用放大或全屏查看。
- 插件以当前 dsh 进程权限 在客户端 Web 环境运行；安装前建议阅读 GitHub 源码 与 LICENSE，内置 Mermaid 的第三方许可见仓库
THIRD-PARTY-NOTICES。
结尾¶
dsh-flowchart 把 Mermaid 留在对话流里完成渲染与交互，避免「代码块 + 外部看图」的断裂。需要安装命令、图种列表与行为细节时，以仓库 README 为准。
