前言¶
在 DeepSeek Harness (dsh) Web 界面中，Markdown 是主要的文本渲染格式。開發者常在對話、軌跡、計劃評審或摘要中使用 Mermaid 語法來繪製圖表，但在未修改 dsh 源碼的情況下，這些圍欄代碼塊通常只顯示爲純文本。dsh-mermaid-preview 插件通過 Cordis 機制接管了渲染過程，將靜態的代碼塊轉換爲可視化的 SVG 圖表。
插件概覽¶
這是一個由 realguan 維護的 Cordis 客戶端插件。它的核心作用是在 dsh Web 界面中，將 Markdown 中的 mermaid 圍欄代碼塊渲染爲可視化的圖表。
安裝與啓用¶
插件支持一條命令安裝，並自動註冊爲 web profile 的 bundle 層。
dsh plugin --profile web add github:realguan/dsh-mermaid-preview
安裝後，重啓 dsh web 即可生效。
核心功能¶
- 免改殼層：不修改 dsh 源碼，通過 DOM 觀察器自動接管
mermaid圍欄。 - 一條命令安裝：
dsh plugin add自動完成註冊與依賴管理。 - 跟隨主題：自動適配 dsh 的明/暗主題，切換時實時重繪。
- 保留交互：原代碼塊的複製按鈕繼續可用，並增加“顯示源碼/顯示圖表”切換功能。
- 失敗兜底：當 CDN 不可達或語法錯誤時，保留代碼塊並給出提示。
- 乾淨卸載：停止插件即移除注入的樣式與 DOM 觀察器。
- 獨立演示：提供零依賴的純 HTML 演示頁。
- 多圖型：支持 flowchart、sequenceDiagram、classDiagram、stateDiagram-v2、gantt、pie、erDiagram、journey、mindmap、gitGraph、timeline 等。
使用說明¶
安裝後，在所有走 MarkdownText 渲染的視圖中（包括對話、軌跡、計劃評審、摘要等），直接使用 mermaid 圍欄代碼塊即可。
注意：流式輸出過程中不渲染，消息結束後才進行渲染。
安全與依賴¶
插件的安全級別爲 strict，不採集任何數據，無運行時依賴。它通過 jsDelivr CDN 加載 Mermaid 11。
獨立演示¶
如果想在本地體驗 Mermaid 的渲染效果，無需啓動 dsh，直接運行演示命令：
npm run demo
結尾¶
該插件解決了在 dsh Web 界面中直接查看 Mermaid 圖表的需求，且不侵入 dsh 核心代碼。
