dsh-mermaid
把 DSH Web 会话消息中的 Mermaid 代码围栏渲染为惰性加载的 SVG 图表,严格消毒并跟随明暗主题。
Render Mermaid code fences in DSH Web chat messages as lazy-loaded SVG diagrams with strict sanitization and light/dark theme follow.
怎么安装
dsh plugin add dsh-mermaid 简介
dsh-mermaid English 在 DSH Web 会话消息中把 mermaid 代码围栏渲染为 SVG 图表的独立插件,通过 dsh plugin 安装进 web profile。 效果预览 | 亮色主题 · 会话内(未放大) | 暗色主题 · 会话内(未放大) | | --- | --- | | | | | 亮色主题 · 放大浮层 | 暗色主题 · 放大浮层 | | --- | --- | | | | 放大浮层自动适配屏幕(接近全屏、四周留白),滚轮缩放,按住左键/中键可拖动平移;theme: auto 时图表颜色跟随 GUI 亮/暗主题。 工作方式 **Host 半部**(src/index.ts):注册 webServer 前缀路由 /mermaid-dist,从插件自己的 node_modules/mermaid 惰性提供 UMD 构建,并提供固定的 config.json 端点。 **Client 半部**(src/client/):监听会话 DOM,把 infostring 为 mermaid 的围栏渲染为 SVG: 1. 只处理**已定格**的围栏(流式输出期间不渲染); 2. 首次遇到围栏才惰性加载 mermaid(浏览器缓存一次); 3. **视口驱动渲染**:围栏进入视口(带 300px 预加载余量)才开始渲染,滚到哪渲染到哪;还在排队/加载中离开视口…
推荐参考
信息
- 协议
- MIT
- 语言
- TypeScript
- GitHub 星标
- 9
- 月下载
- 3.3K
- 最近更新
- 2026-08-18
- 创建于
- 2026-08-14
基础安全检查
- 检查结果
- 无
- 收录来源
- curated:awesome-dsh-plugin.com, curated:awesome-dsh-plugin/awesome-dsh-plugin
- 主题标签
- cordis, deepseek-harness, diagram, dsh, dsh-plugin, markdown, mermaid, plugin
同类推荐
dsh-univer-office
dream-num/dsh-univer-office
为 DeepSeek Harness 打造一个真正的办公环境。Univer Office 插件将电子表格、文档、幻灯片、画布、多维表格等汇聚到同一个运行时——数据互联、修改经过校验、变更按版本管理,并以隔离工作树支持多 Agent 协作。
archify
tt-a1i/archify/tree/main/integrations/deepseek-harness
从仓库或系统描述生成经过校验的自包含交互式架构图、流程图、时序图、数据流图和生命周期图。
dsh-mermaid
MrmoLabs/dsh-mermaid
将 Mermaid 代码围栏渲染为 SVG 图表,支持流式输出、图形/代码切换、全屏缩放与拖拽、SVG 导出,以及内置的同源运行时。