前言¶

在 DSH 的 Web 會話頁裏，對話、工具調用和工作區文件經常需要來回切換：一邊要查看當前會話正在操作的文件，一邊又要確認 Git 狀態與變更差異。dsh-ui-workbench 是 DeepSeek Harness 的 WebUI 插件，它把當前會話工作區的文件樹、文件查看器和 Git 審查面板放到會話頁右側，讓 Web 端不需要額外打開本地編輯器也能完成基礎審查。

下面介紹這個插件的定位、功能、安裝方式和適用邊界。

這是什麼¶

LoftyTao/dsh-ui-workbench 由 LoftyTao 維護，許可證爲 MIT，狀態爲 Experimental。它屬於 DSH 的 Client 類插件，面向 web profile 下的 DSH Web Client，能力範圍是當前會話工作區的文件瀏覽與 Git 審查。

簡單來說，它做的事情是在 DSH 會話頁右側增加一個 Workbench 面板：

• Host 側提供 /sidebar/api/* 路由。
• Browser 側提供 Workbench 面板。
• 通過會話作用域的 DSH Host 工作區服務訪問文件與 Git 狀態。
• 不保存憑據。
• 提供工作區審查界面，不承擔 Git 提交、憑據保存或通用文件編輯職責。

核心功能¶

文件樹與文件查看¶

插件可以在當前會話工作區內展示文件樹，並支持按文件名搜索。打開文件後，提供帶行號、語法高亮和長行換行的 UTF-8 文件查看器。

這個能力主要用於在會話過程中快速確認文件內容，尤其是當模型正在修改某個文件、導入某個資源或生成某個結果時，可以在右側直接查看對應文件。

Git 差異審查¶

插件支持查看 Git 狀態與差異，覆蓋：

• 已暫存文件。
• 未暫存文件。
• 未跟蹤文件。
• 提交引用。

差異視圖支持統一視圖和並排視圖，也可以按變更文件篩選，並摺疊上下文。這樣在會話中審查一次代碼改動時，不需要切到終端手動執行 Git 命令後再回來看。

主題與語言適配¶

插件支持中英文與亮暗主題適配，主題跟隨 DSH 外觀設置即時切換。

內置了霞鶩新晰黑屏幕閱讀版補全字體，用於改善屏幕閱讀體驗。

Typst 即時預覽¶

插件支持 .typ 文件的 Tinymist 風格 rich SVG 即時預覽。

Typst 預覽依賴 Harness Host 環境中的 typst 可執行文件。通常要求 typst 位於 Harness Host 的 PATH 中；如果不在 PATH 中，也可以通過 DSH_TYPST_BIN 指定 Typst 可執行文件的絕對路徑。

如果還需要加載其他字體目錄，可以使用 Typst 標準環境變量 TYPST_FONT_PATHS 顯式增加目錄。

安裝與啓用¶

安裝前需要準備：

• Node.js 22.19+
• 帶 web profile 的 DeepSeek Harness

然後使用下面的命令安裝 v0.3.0 tag：

npx -y --package @deepseek-ai/dsh dsh plugin --profile web add github:LoftyTao/dsh-ui-workbench#v0.3.0

該命令會把插件加入 web profile。使用 v0.3.0 tag 可獲得 Typst 即時預覽、熱重載、Git 審查和亮暗主題特性。

如果在源碼倉庫中進行本地檢查或源碼安裝，也可以使用下面的命令：

dsh plugin --profile web add ./plugins/client/dsh-ui-workbench

安裝或構建後，可以用下面的命令查看 web profile 的配置：

dsh --profile web --dump-config

典型用法¶

下面是一個比較直接的使用路徑。

1、啓動帶 web profile 的 DeepSeek Harness，進入 DSH Web Client 的會話頁。

2、在會話頁右側打開 Workbench 面板，查看當前會話工作區的文件樹。

3、在文件樹中搜索文件名，或打開某個文件，使用帶行號、語法高亮和長行換行的查看器查看內容。

4、切換到 Git 審查相關視圖，查看已暫存、未暫存、未跟蹤文件或提交引用中的差異。

5、如果工作區中有 .typ 文件，打開該文件查看 Typst 即時預覽。預覽依賴 Harness Host 可執行文件 typst，或依賴 DSH_TYPST_BIN 指定的絕對路徑。

6、切換 DSH 外觀設置或語言設置時，面板會跟隨 DSH 主題與語言狀態進行適配。

源碼邊界與本地檢查¶

插件的代碼邊界比較明確：

• 瀏覽器端只能通過 src/client/api.ts 訪問 Host。
• Git 命令集中在 src/git.ts。
• 文件系統訪問集中在 src/fs.ts。

Host Config 當前爲空對象。面板寬度由 Browser 狀態管理；主題讀取可用的 DSH theme 服務並觀察 DSH DOM 主題標記；語言讀取 DSH 文檔狀態。

在源碼倉庫中，可以運行下面的檢查和打包校驗命令：

pnpm check
pnpm pack:check

這些命令用於源碼側的類型、測試和包產物檢查。具體驗收以倉庫內腳本與文檔爲準。

適用場景與注意¶

適合使用 DSH web profile、希望在 Web 會話頁直接查看當前工作區文件和 Git 差異的開發者。如果你的工作流中經常出現以下情況，這個插件會比較有用：

• 需要在會話過程中快速查看模型正在操作的文件。
• 需要確認當前會話工作區內的文件變化。
• 需要查看未暫存、未跟蹤文件或提交引用中的差異。
• 需要預覽 .typ 文件。

需要注意幾點：

• 該插件狀態爲 Experimental，許可證爲 MIT。
• 適用範圍是 web profile、DSH Web Client 和當前會話工作區。
• 它提供工作區審查界面，不承擔 Git 提交、憑據保存或通用文件編輯職責。
• 插件以當前 DSH 進程權限訪問工作區文件與 Git 狀態，安裝前應檢查源碼和許可證。
• 不保存憑據。
• Typst 預覽以當前會話工作區作爲 --root，因此導入和資源訪問不會越過工作區邊界。
• 需要 Node.js 22.19+ 與帶 web profile 的 DeepSeek Harness。

結尾¶

dsh-ui-workbench 的價值在於把文件查看、Git 差異審查和 Typst 預覽放進 DSH WebUI 的會話頁右側，讓 Web 端在同一個會話界面裏完成一部分工作區審查。

相關鏈接：

• GitHub：https://github.com/LoftyTao/dsh-ui-workbench
• 社區插件目錄線索：https://www.skillhub.cn/plugins/LoftyTao/dsh-ui-workbench（該 URL 來自插件線索，未在本次資料中直接確認）