DeepSeek Harness (DSH) 的核心优势在于流式输出与实时交互。在开发智能体或调试 UI 生成时，模型输出的是文本指令，而最终产物是 HTML 文档。如何在模型生成过程中看到渲染结果，是一个常见需求。dsh-visualizer 插件通过在沙盒内联框架中实时渲染 HTML，填补了这一空白。
这是什么¶
DeepSeek Harness 插件，提供实时 HTML 文档流式传输与预览功能。
该插件由维护者 abiddotdev 开发，遵循 MIT 许可证。它将自包含的 HTML 文档流式传输到聊天中，并在沙盒内联框架中进行实时预览。这允许使用 Chart.js 等外部库，且无需触碰工作区。生成的文档可下载为 .html 或 .svg 文件，且在回合关闭前，Settled 卡片会保持活跃。
核心功能¶
- 流式传输与预览：将自包含的 HTML 文档流式传输到聊天中，并在沙盒内联框架中进行实时预览。
- 外部库支持：支持 Chart.js 等外部库，无需触碰工作区。
- 下载功能：生成的文档可下载为
.html或.svg文件。 - 注释模式：支持注释模式，可点击元素获取选择器和标记，方便模型精准编辑。
- Settled 卡片行为：在回合关闭前保持活跃，通过
turn-tail扩展点重新发布卡片。
安装与启用¶
安装前需确认环境满足要求：
* Node.js 版本需为 ^22.19 或 >=24。
* DeepSeek Harness 版本需为 0.1.2-rc.1 或更新版本。
安装到默认 profile 的命令如下：
dsh plugin --profile web add 'git+https://github.com/abiddotdev/dsh-visualizer.git'
若需安装到自定义 profile，请替换 <your-profile>：
dsh plugin --profile <your-profile> add 'git+https://github.com/abiddotdev/dsh-visualizer.git'
首次运行注意：
首次运行可能会遇到 pnpm 的供应链安全提示，提示需要配置 allowBuilds。请按照提示将对应的 Key 添加到 ~/.dsh/profiles/<your-profile>/pnpm-workspace.yaml 文件中的 allowBuilds 下，然后重新运行命令。
典型用法¶
- 版本控制：使用 ref 片段安装特定版本，例如：
dsh plugin --profile <your-profile> add 'git+https://github.com/abiddotdev/dsh-visualizer.git#v0.2.0'
- 旧版兼容：若 Harness 版本低于
0.1.2-rc.1，需使用兼容分支：
dsh plugin --profile <your-profile> add 'git+https://github.com/abiddotdev/dsh-visualizer.git#pre-harness-0.1.2-alpha3-compat'
- 使用插件：启动 profile 并要求模型 “visualize …”，模型生成的 HTML 将在卡片中实时渲染。
适用场景与注意¶
该插件适合需要实时生成和预览 UI 界面、图表或交互式文档的场景。
配置注意事项：
插件的 bundle layer 会自动插入 loader row，因此配置覆盖需要直接在 profile 的 patch layer 中进行，而不是嵌套在 insert 下。配置项（如 maxArtifactBytes、guideTypes 等）需直接写在 profile 的 cordis.patch.yml 中。
生态背景：
DeepSeek Harness 理念是「一切皆插件」。社区目录（如 SkillHub）是独立站点，与 DeepSeek / 幻方无官方从属关系。
总结¶
dsh-visualizer 提供了一种无服务器端往返的流式 UI 生成方案。通过直接在客户端沙盒中渲染和交互，它降低了开发调试的门槛，使得模型生成 UI 的过程更加直观可控。
