DSH 會話中,PowerShell(pwsh)工具卡片的樣式往往較爲單一,缺乏統一的視覺規範和交互細節,影響閱讀體驗。下面介紹 dsh-pwsh-style 插件,它通過 CSS 注入和 DOM 裝飾,爲這些卡片提供了一套完整的換裝方案。
插件定位¶
dsh-pwsh-style 是由 me9rez 維護的插件,分類爲“趣味換裝”。它的核心作用是修改 DSH 會話回覆中 pwsh 工具卡片的主題、字體與可讀性。架構沿襲了 dsh-file-mentions:Host 半負責設置與配置路由,Client 半通過 __ModuleLoader__ bundle 注入 CSS 並可選裝飾 DOM。
核心功能¶
- 八套主題:提供
ps-blue、monokai、classic、dracula、nord、tokyo-night、solarized-dark、github-light等預設。這些主題只通過--pwsh-panel-*變量作用於插件新增的元素(徽標、工具條、命令面板),絕不改寫原生輸出配色。 - PowerShell 徽標:卡片標題行自動注入 PS 圖標藥丸。
- 複製命令按鈕:從
tool/call事件精確讀取arguments.command,點擊即可複製命令內容,不混入描述、輸出或按鈕文本。 - 展開/收起按鈕:顯示完整命令(長命令不再被省略號截斷),並展示調用時的 工作目錄。
- 字體配置:支持下拉選擇系統已安裝字體(
font-list枚舉),並調整字號(11–16px)與字重(300–700)。 - 零 hash class 依賴:全部鉤子基於穩定的
data-*屬性,DSH 升級重寫 CSS-module 類名也不失效。
安裝與啓用¶
- 確保系統 PATH 中包含
pnpm(dsh plugin會轉發給 pnpm)。 - 執行官方安裝命令:
dsh plugin --profile web add "github:me9rez/dsh-pwsh-style#main"
本地開發時也可用 link 方式安裝:
dsh plugin --profile web add "link:C:/workspace/dsh-pwsh-style"
- 安裝後需要重啓
dsh web。該插件的 bundle 層在啓動時組合,熱更新(HMR)不生效。瀏覽器端需要硬刷新頁面才能看到效果。
配置說明¶
打開 DSH Web GUI,進入 設置 頁面,找到本插件的配置卡片。
可配置項包括:
* 啓用:開關插件整體效果。
* 主題:下拉選擇八套預設之一。
* 字體:下拉框選擇系統字體,或選擇“默認等寬字體”恢復內置棧(系統字體枚舉失敗時的回退列表)。
* 字號:11–16px。
* 字重:300(細)/ 400(常規)/ 500(中)/ 600(半粗)/ 700(粗)。
注意:字體配置的唯一例外是,它會整體覆蓋官方 token --dsw-font-markdown-code-block-small,以便讓命令提示行與輸出區跟隨所選字體。默認值時不注入任何樣式。
工作原理¶
該插件通過 [data-tool="pwsh"] 屬性定位卡片。由於 pwsh 在外層被歸類爲 bash 變體(TOOL_VARIANTS: { pwsh: "bash" }),但它的 entryKey 仍是字面工具名 "pwsh",因此命不中 bash toolview,回退到 GenericToolCard,其根元素穩定打上 data-tool="pwsh"。
命令數據從 tool/call 事件的 arguments 中讀取 command / workdir,通過祖先節點的 data-chat-call-id 精確關聯到卡片。徽標、按鈕、命令面板等節點需要新建,插件使用 MutationObserver 在 React 渲染後動態插入,下一幀自動補回。
結語¶
該插件通過零 hash class 依賴和穩定的屬性鉤子,確保了在 DSH 升級後的兼容性。對於需要頻繁查看 PowerShell 輸出或希望統一會話風格的開發者,這是一個實用的配置項。