deepseekplugins

DeepSeek Harness 插件

dsh-mermaid-renderer

DeepSeek Harness 网页插件：自动把聊天中的 Mermaid 代码块渲染成可缩放、可切换源码的图表（英文原文）

工具与能力
跳到安装方式

来源信息

GitHub 仓库
timedomain1/dsh-mermaid-renderer
最近更新
2026年8月21日
分类
工具与能力
GitHub stars
0
载体类型
plugin
目录证据
上游声明已找到 dsh.bundle
证据路径
package.json#dsh.bundle
核对版本
0.1.0-rc.8
上游核对日期
2026-08-20

该证据由上游目录提供。本站没有安装、运行或安全审核这个插件。

安装

默认先复制一段 Prompt，让 Agent 读 GitHub 仓库和源码；需要自己装时再切到命令。

复制这段 Prompt，发给 DSH、Codex 或其他 Agent，让它先读 GitHub 仓库和源码。

请先不要安装或执行任何命令。阅读这个插件的 GitHub 仓库、README 和关键源码，然后用清楚、直接的方式回答以下问题，帮助我判断它是否适合我的需求：

1. 这个插件是什么，解决什么问题；
2. 适合哪些用户和典型使用场景；
3. 安装后如何使用，并给出一个最小使用示例；
4. 有哪些已知限制，以及隐私、安全、兼容性或维护风险；
5. 给出“推荐 / 有条件推荐 / 不推荐”的明确建议和理由。

请区分仓库明确说明、根据源码推断和未知信息。证据不足时请明确说明，不要猜测或照抄 README。

GitHub：https://github.com/timedomain1/dsh-mermaid-renderer
插件名：dsh-mermaid-renderer
作者：timedomain1

检查来源文件

安装前先看这个插件目录里的 README 和其他文件。

文件资源管理器4 个文件
README.zh.md来源说明 · 只读预览
README 语言

dsh-mermaid-renderer

English | 中文

DeepSeek Harness（dsh）网页插件：自动把聊天里的 Mermaid 代码块渲染成图表卡片。 支持 flowchart / graph / sequenceDiagram / classDiagram / stateDiagram / erDiagram / journey / gantt / pie / mindmap / timeline / C4Context / gitGraph 等 Mermaid 图型。

功能

  • 聊天中的 ```mermaid 代码块自动变为渲染图（流式输出、切会话、滚动重建后都会自动补扫）；
  • 全局美化默认值：未自带 %%{init}%% 的图自动获得更大的字号/间距、柔和连线色与中性节点底色、basis 曲线（每张图自己的 init 指令仍可覆盖）；
  • 每个图表卡片可切换「图表 / 代码」两个视图；
  • 连续放大 / 缩小 / 还原（0.25x–4x，无次数限制；卡片内 Ctrl+滚轮 也可缩放，超出宽度时横向滚动）；
  • ⛶ 独立查看器：全屏浮层单独打开（不受聊天区重渲染影响），滚轮绕光标缩放（5%–1000%）、拖拽平移、适应宽度 / 100%、双击适应、ESC 关闭；还可「新标签页打开」成独立自包含页面，配合浏览器缩放查看全局；
  • 一键「复制源码」；
  • Mermaid 引擎按需加载（首个图表出现时才联网拉取），失败时保留代码视图并提示重试；
  • 纯 DOM 后处理，不侵入界面框架，卸载后页面恢复原样。

安装

要求：DeepSeek Harness 0.1.0-rc.8（web profile），且已启用 pnpm。

> 前置准备（一次性）：dsh plugin 底层调用 pnpm。若 pnpm --version 提示找不到命令，在管理员终端执行 corepack enable 启用（Node 自带 corepack），然后新开一个终端即可。

# 从 GitHub 安装（推荐：无需发布 npm，一条命令即可，无需手动下载压缩包）
dsh plugin --profile web add git+https://github.com/timedomain1/dsh-mermaid-renderer.git

# 或从 npm 安装（发布到 npm 后可用）
dsh plugin --profile web add dsh-mermaid-renderer

# 或从本地目录安装
dsh plugin --profile web add file:/path/to/dsh-mermaid-renderer

本包无需构建步骤（bundle 已写好），git 安装开箱即用。

安装后重启 dsh web 并刷新浏览器页面。验证：在聊天中发送一个 ```mermaid 代码块，或打开历史消息中的 mermaid 代码块。

> 说明：dsh plugin 会转发给 pnpm 安装并把本包（声明了 dsh.bundle.patch）自动加入 web profile 的 bundle 层。无 pnpm 时也可手动安装：把本包目录放进 $DSH_HOME/profiles/web/node_modules/dsh-mermaid-renderer/，并把 "dsh-mermaid-renderer" 追加进 $DSH_HOME/profiles/web/package.json 的 dsh.profile.bundles 列表。

卸载

dsh plugin --profile web remove dsh-mermaid-renderer

重启 dsh web。手动安装者：删除上述 node_modules 目录并移除 bundles 列表中的条目。

兼容性与依赖

  • 浏览器半：无任何第三方依赖（手写 __ModuleLoader__ 静态 bundle，按官方 dsh.client 协议打包）；
  • 宿主半：空 apply，仅用于出现在 Cordis 组合中（同官方 dsh-client-ui-* 插件模式）；
  • Mermaid v11 引擎在浏览器首次渲染时从 jsDelivr / unpkg CDN 加载（需要联网）。

可自定义引擎地址：在浏览器控制台或更早加载的脚本里设置 window.__DSH_MERMAID_URL__ = 'https://你的镜像/mermaid.min.js'。 离线场景可自行把 mermaid.min.js 内联进 lib/client.js 的加载逻辑。

分享 / 发布到社区

1. 改好 package.json 里的版本号后 npm publish； 2. 注册进社区目录： - dsh.fish（插件发现/安装器，按其 README 提交条目） - awesome-dsh-plugins - awesome-deepseek-harness - Anil-matcha/awesome-dsh-plugin

工作原理

包是标准的「双面」dsh 插件：cordis.patch.yml（dsh.bundle.patch）在 profile 组合中插入一行（name 为包名），宿主的客户端模块系统（@deepseek-ai/dsh-client-modules）据此扫描 dsh.client 声明，把 lib/client.js 注入网页启动清单 window.__DSH_BOOT__，浏览器侧的 Cordis loader 实例化后调用 apply(ctx)。apply 里用 MutationObserver 监听聊天区 DOM，发现 Mermaid 代码块后懒加载引擎并渲染为 SVG。

License

MIT

返回搜索打开 GitHub 仓库

更多相关插件

查看分类