josephhy/dsh-md-plus:给 DSH Web/Desktop 重做 Markdown 阅读体验

前言

DSH(DeepSeek Harness)的理念是「一切皆插件」,Markdown 渲染这件事本身也落在宿主里。默认渲染能用,但在长对话里会遇到几件具体的事:代码块样式发散、DSH 不认识的语言没有语法高亮、mermaid 围栏原样躺在正文里、长日志和长表格把窗口撑满、想复制一张表还得手动选中。dsh-md-plus 针对的就是这几点,它不改 Markdown 的解析结果,只改这些内容在屏幕上怎么呈现。

下面介绍这个插件的定位、功能、安装方式和已知限制。

这是什么

dsh-md-plus 是一个客户端插件,维护者是 JosephHy,分类为客户端,社区目录 SkillHub 上显示 1 个星标。它面向 DeepSeek Harness Web 和 Desktop,把代码块、mermaid 图形、表格、正文图片和显示设置重新做了一遍,并在右下角提供了一个设置面板。项目许可证为 MIT,当前版本 0.4.0。

它与宿主的关系是:只依赖宿主已有的 DOM 钩子(如 .md-code-block、[data-code-block-content]、[data-code-block-banner]、data-streaming),在渲染结果之上做样式和交互增强,不改动解析产物。

核心功能

代码块卡片与补高亮

代码块统一重做成完整卡片,头部显示 </> 图标和语言名,没有声明语言时显示 Plain text。宿主原生的换行按钮和复制按钮保留,顶栏与卡片同色。对于 DSH 语言表(快照 108 条)不认识的语言,插件用 shiki 补语法高亮,按需加载。

Mermaid 图形

mermaid 围栏直接渲染成 SVG,可以在「图形 / 代码」视图之间切换。全屏查看器支持滚轮缩放、拖拽、双击适应、Esc 关闭,提供四套配色,并支持下载 SVG 和 PNG。

长内容折叠

代码块、表格、图表超过阈值后自动折叠,底部出现「展开 / 收起」,长日志和长表格不会把聊天窗口撑满。

表格复制

表格提供浅色和深色两套样式,表头吸顶。每张表上方右侧有「CSV / Markdown」两个复制按钮,免去手动选中复制。

图片放大

只在旧宿主没有原生预览按钮时兜底:点击图片打开暗色预览,Esc 或点击遮罩关闭。新版 DSH 的原生预览、头像、图标、代码块内图片和链接内图片都不接管。

设置面板

右下角齿轮可以调 Mermaid 配色、代码字号、图表默认视图和三类折叠阈值,阈值项下方会注明按高度判断。设置存在 localStorage,界面文案跟随页面 <html lang> 切换中英文。

安装与启用

安装命令来自 README,profile 指定为 desktop:

dsh plugin --profile desktop add dsh-md-plus      # 也可以用 github:JosephHy/dsh-md-plus
dsh plugin --profile desktop remove dsh-md-plus

上面第一条按插件名安装,注释里给出的是 GitHub 路径形式,两者等价。卸载用第二条。插件随当前 dsh 进程运行,用的是该进程的权限,安装前建议先看一下源码和许可证。

典型用法

装好之后无需额外配置,正文里的 mermaid 围栏会直接出图:

graph TD
    A[输入] --> B{判断}
    B -->|是| C[渲染 SVG]
    B -->|否| D[保持原样]

表格上方会出现 CSV / Markdown 复制按钮,点一下就能把整张表取走。想改显示参数时点右下角齿轮,例如把折叠阈值调低,长输出就更早收起来。

开发与验证

需要 Node.js ≥ 22.19:

npm install       # 顺带跑 prepare → build
npm run build     # 产出 lib/ 下四个文件
npm run check     # 语法检查 + 65 条测试(先 build 再跑,check 不含 build)
npm run preview   # 生成 preview.html(含真渲出来的 mermaid 图)
npm run shot      # 用 headless Chrome 把 preview.html 截成 docs/preview.png

适用场景与注意

适合在 DSH Web/Desktop 里看长对话、含代码和图表的技术内容的人:重做的是阅读层,不碰解析,可以放心用在已有项目上。

几点需要注意:

  1. 插件以当前 dsh 进程权限运行,安装前先检查源码与许可证(MIT)。
  2. DSH 0.2.0-rc.2 上,代码块头部语言名由宿主决定:宿主不认识的语言会显示占位文案「代码块」,插件读不到围栏语言,补高亮基本失效。mermaid 因此改看正文里的类型声明来识别。
  3. DSH_LANGS 是 DSH 语言表的快照(108 条),宿主新增语言后快照会落后,结果只是多一次无效处理,不会出现双份高亮。
  4. mermaid 12 的新图种(usecase-beta、agentflow-beta)标识符只认字母数字下划线,中文要写进标签:actor Customer("用户") 可以,actor 用户 会解析失败。
  5. 高亮约 6.4 MB、mermaid 约 5.0 MB,按需下载,第一次用到时多花约 100ms 解析。
  6. 插件依赖宿主的 DOM 钩子,DSH 改版后可能需要同步调整 src/client.js。

结尾

dsh-md-plus 的价值在于把 DSH 对话里最常出现的几类内容——代码、图形、表格、长输出——的显示收整齐,同时不介入解析、不改动正文结构。目录页在 https://www.skillhub.cn/plugins/JosephHy/dsh-md-plus ,源码在 https://github.com/JosephHy/dsh-md-plus 。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

Xiaoye