dsh-mermaid-renderer
DeepSeek Harness 聊天界面插件（命令行网页端 + 官方桌面端通用）：自动把聊天中的 Mermaid 代码块渲染成可缩放、可切换源码的图表
插件会安装到这里；不确定时保持 web。
npx -y @deepseek-ai/dsh plugin --profile web add github:timedomain1/dsh-mermaid-renderer#9d39e0b0ab7d332e4d2c1b77c6a5f6e03e185d47Mermaid Renderer 以 dsh-mermaid-renderer 发布，当前版本为 1.3.0。Plugin Hub 会校验它的 manifest，并保存精确安装来源，便于复现安装结果。
English | 中文
A DeepSeek Harness (dsh) chat-UI plugin that renders Mermaid code blocks in the chat as diagram cards.
Supports flowchart / graph / sequenceDiagram / classDiagram / stateDiagram / erDiagram / journey / gantt / pie / mindmap / timeline / C4Context / gitGraph and more.
Works in both the command-line web UI and the official desktop app — the desktop app embeds the same chat UI, and both hosts share one plugin codebase.
document.body, immune to chat re-renders) with cursor-centered wheel zoom (5%–1000%), drag-to-pan, fit-width / 100%, double-click to fit, ESC to close; plus open in a new tab as a self-contained page for global viewing with the browser's own zoom;ctx.effect).One codebase serves both the command-line web UI and the official desktop app — the two hosts share an
identical client-plugin contract (verified against dsh-client-modules / dsh-client-ui-conversation /
dsh-cordis-client-runner).
| Host | Version (tested) | profile name |
|---|---|---|
CLI dsh web | 0.1.5-rc.1 | web |
| Official desktop app (latest) | 0.2.0-rc.2 | desktop |
The two hosts read separate profiles, so enabling both means installing twice — the code itself is shared. ⚠️ How a source edit propagates differs: the desktop app links to the source (restart is enough), while the web profile gets a copy — it must be removed and re-added to update (
add --forcedoes not work).
Requires DeepSeek Harness >=0.1.5-rc.1 (supports the latest desktop app, 0.2.0-rc.2) with pnpm enabled.
One-time prerequisite:
dsh pluginshells out to pnpm. Ifpnpm --versionfails, runcorepack enablein an admin terminal (Node ships corepack), then open a new terminal.
web)# From GitHub (recommended — no npm publish needed)
dsh plugin --profile web add git+https://github.com/timedomain1/dsh-mermaid-renderer.git
# Or from a local checkout (good for development)
dsh plugin --profile web add file:/path/to/dsh-mermaid-renderer
desktop)The desktop app bundles its own Node/pnpm, so no command-line toolchain is required. Open the in-app Plugins page → add plugin, and enter either form:
https://github.com/timedomain1/dsh-mermaid-renderer # Git repository URL (recommended)
D:\DeepSeekHarness\plugins\dsh-mermaid-renderer # local plugin directory (must be absolute)
The desktop plugin manager accepts four source forms: npm package name, Git repository URL, tarball URL (
.tgz), and an absolute local path. Relative paths are rejected.The
desktopprofile is owned exclusively by the Electron app:dsh plugin --profile desktopis rejected (profile "desktop" is managed exclusively by the Electron application). Use the in-app page.
See Releases — every version carries full change notes and a host-compatibility table.
Restart the host (restart dsh web; fully quit and reopen the desktop app), then send a ```mermaid code
block or open one in an existing message. The two hosts are independent — installing for one does not affect
the other.
Open the developer console for the startup line (desktop app: F12 or Ctrl+Shift+I; browser: F12):
[dsh-mermaid-renderer] v1.3.0 已启用：聊天中的 Mermaid 代码块将自动渲染
dsh pluginforwards to pnpm and adds this package (it declaresdsh.bundle.patch) to the target profile's bundle layer automatically. Without pnpm you can install manually: place this package directory at$DSH_HOME/profiles/<profile>/node_modules/dsh-mermaid-renderer/and append"dsh-mermaid-renderer"todsh.profile.bundlesin that profile'spackage.json.
dsh plugin --profile web remove dsh-mermaid-renderer # command-line web UI
Desktop app: remove dsh-mermaid-renderer from the in-app Plugins page. Manual installs: delete the
node_modules/dsh-mermaid-renderer/ directory and the bundles entry in the corresponding profile.
Restart the host afterwards.
dsh.client /
__ModuleLoader__ protocol); the inlined Mermaid engine ships with the file, so no internet is required;apply (present in the Cordis composition only), same pattern as the official dsh-client-ui-* packages;dsh.client.immediately and inject: ["@deepseek-ai/dsh-client-ui-conversation"], so the
plugin activates after the conversation UI is ready (matches the official templates/decoration; both hosts
support these fields);window.__DSH_MERMAID_URL__ (custom mirror, settable from the console)client.js — the offline fallback)lib/client.js is generated (≈3.43 MB with the engine inlined). Edit lib/client.src.js instead, then run
node scripts/build-client.mjs. Verify freshness with node scripts/build-client.mjs --check, and verify the
engine with node scripts/test-inline-engine.mjs.No. The host serves a plugin bundle with cache-control: public, max-age=31536000, immutable, and bundle URLs
carry a content fingerprint — so nothing is re-transferred unless the plugin is upgraded, the cache is
cleared, or the browser changes. In the desktop app the bundle is a local junction to the source directory and
never crosses the network at all.
Note: plugin bundles sit in the boot manifest's
applicationpreload batch, which is independent ofdsh.client.immediately— that flag governs when the factory executes, not when the bytes are fetched. See the corresponding section inCHANGELOG.md.
Distribution is GitHub-first (main branch + version tags + Releases). A publish script is included, and it
takes the release notes from the CHANGELOG section, so the two never drift apart:
# 1. Before releasing: bump package.json and update CHANGELOG.md (incl. the compatibility table)
# 2. Commit and tag
git add -A && git commit -m "feat: ..." && git tag vX.Y.Z && git push origin main --tags
# 3. Publish the Release (check the payload first)
node scripts/publish-github-release.mjs vX.Y.Z --dry-run
node scripts/publish-github-release.mjs vX.Y.Z
The script derives owner/repo from
git remote get-url origin(so it works from a fork) and reads the token from the git credential helper without printing it.
Other optional steps:
scripts/vendor-mermaid.mjs to refresh .vendor/mermaid.min.js, rebuild with
node scripts/build-client.mjs, then verify with node scripts/test-inline-engine.mjs;npm pack output to the Release;Optional:
npm publishwould also allow installing by package name. Not published at this time.
The package is a standard dual-face dsh plugin: cordis.patch.yml (dsh.bundle.patch) inserts one row (its name is the package name) into the profile composition; the host's client-modules service (@deepseek-ai/dsh-client-modules) discovers the dsh.client declaration, serves lib/client.js through the plugins route and injects it into the boot manifest; the browser Cordis loader instantiates it and calls apply(ctx). apply watches the chat DOM with a MutationObserver, lazy-loads Mermaid and renders SVG in place.
Styles, timers and DOM listeners are registered inside apply's ctx.effect, so unloading the plugin disposes
all of them and leaves no residue on the page.
Why DOM post-processing instead of an official slot: the host currently exposes no extension point for code block content (none of the available slots can take over markdown code rendering, and the renderer package exposes no markdown/remark extension). The documented
conversation.chat.nodeslot adds message rows and cannot rewrite existing code blocks. See the "known deviations" section inCHANGELOG.md.
lib/client.src.js hand-written template — edit this one
lib/client.js generated, contains the inlined engine (do not edit)
lib/index.js host half (empty apply)
.vendor/mermaid.min.js the inlined engine (committed, so builds work offline)
scripts/build-client.mjs build: template + engine → lib/client.js
scripts/test-inline-engine.mjs verify the inlined engine initializes
scripts/publish-github-release.mjs publish a Release (notes come from CHANGELOG)
cordis.patch.yml bundle patch
CHANGELOG.md versions and the host-compatibility table
MIT