dsh-workstation-spec:把 Chrome 工作站 UI 規範做成 DSH 工具

前言

在 DSH 裏給某個網站做「工作站版」Chrome 擴展時,外殼佈局、Design tokens、組件與驗收清單往往要反覆查文檔或憑記憶拼。規範散在筆記或舊項目裏,模型每次從零描述,容易漏項或與既有站點不一致。

下面介紹的 dsh-workstation-spec 把同一套「Chrome 工作站 UI 規範」註冊成 Host 側的兩個模型工具:先讀規範章節,再取起步模板文件,不必在對話裏重寫整份 spec,也不注入網頁、不改 DSH 界面。

這是什麼

dsh-workstation-spec 由維護者 pierrotto12138-code 發佈,在 SkillHub 目錄中歸類爲客戶端插件。它是一個 Host-only 的 DSH 組合包(bundle):只向當前 profile 註冊 workbench_spec 與 workbench_starter,運行時無額外 npm 依賴,不 import @deepseek-ai/* 包。

規範正文在倉庫 assets/spec.md;起步模板在 assets/starter/(manifest、station、css、background)。當前 package 版本爲 0.2.3,許可 MIT。

核心功能

插件只做兩件事,對應兩個工具。

工具 作用
workbench_spec 讀規範:不帶參數返回目錄,帶 section 返回對應章節
workbench_starter 取起步模板中的單個文件:manifest / station / css / background

規範覆蓋範圍(據 README):三條鐵律、形態選擇、佈局系統、Design tokens、組件規範、交互、可訪問性、工程結構、站點適配流程、評審規則清單、驗收清單,以及默認風格(作者複用到各站點時的固定選擇,如白底單藍、扁平側欄等)。

workbench_spec 章節別名

不帶 section 時返回章節目錄。常用 section 與章節對應關係如下。

section 章節
intro / rules 三條鐵律
form 形態選擇
layout 佈局系統
tokens / token Design tokens
components 組件規範
interaction 交互
a11y / accessibility 可訪問性
structure / engineering 工程結構
adaptation / site 站點適配流程
checklist 規則清單
acceptance 驗收清單
style / defaults / preference 默認風格

workbench_starter 文件類型

file 參數取上述四類之一,返回該文件的完整內容,可直接複製到新站點目錄。

安裝與啓用

需要 DSH 0.2.1-rc.5 或同系列 0.2.x(package.json 聲明 >=0.2.1-rc.5 <0.3.0),以及 Node.js >= 20。本包沒有 prepare / build 腳本,一般不需要在 pnpm-workspace.yaml 裏配置 allowBuilds。

從 GitHub 安裝

把 <profile> 換成你的 profile 名(例如 web、desktop、tui):

dsh plugin --profile <profile> add github:pierrotto12138-code/dsh-workstation-spec

生產環境建議釘住 commit,避免後續推送改變實際安裝內容:

dsh plugin --profile <profile> add github:pierrotto12138-code/dsh-workstation-spec#<commit-sha>

從本地目錄或壓縮包安裝

若已有源碼目錄或 npm pack 產物,也可本地添加(README 中的示例):

dsh plugin --profile <profile> add ./dsh-workstation-spec

或:

dsh plugin --profile <profile> add ./dsh-workstation-spec-0.2.0.tgz

安裝後重啓 DSH(新增 bundle 只在啓動時讀取;啓用 HMR 的 profile 會等待重組)。

驗證安裝

dsh --profile <profile> --dump-config | grep -A2 dsh-workstation-spec

應能看到類似一層配置:

# == dsh-workstation-spec
- id: dsh-workstation-spec
  name: dsh-workstation-spec

典型用法

在工具側直接調用:

workbench_spec()
workbench_spec(section="layout")
workbench_starter(file="manifest")
workbench_starter(file="station")
workbench_starter(file="css")
workbench_starter(file="background")

在 DSH 對話中的典型流程(README 示例):說明要爲某站點做工作站擴展、要完成的具體能力;模型可先調 workbench_spec(section="form") 選形態,再調 workbench_starter(file="manifest") 等取模板,再按規範實現其餘邏輯。

適用場景與注意

適合誰:經常在 DSH 裏驅動模型爲不同站點生成「工作站形態」Chrome 擴展、且希望 UI 與工程結構對齊同一套書面規範的開發者。

運行方式:插件以當前 DSH 進程權限在 Host 側運行,不注入任何網頁。安裝前應自行查看倉庫源碼與 MIT 許可證,確認 bundle 行爲符合預期。

卸載:

dsh plugin --profile <profile> remove dsh-workstation-spec

卸載會同時移除 profile 依賴和 dsh.profile.bundles 中的條目。

兼容性摘要(README):DSH >=0.2.1-rc.5 <0.3.0(實測 0.2.1-rc.5);Node.js >= 20;無運行時依賴;無構建步驟。

結尾

dsh-workstation-spec 把工作站 UI 規範與起步模板收進兩個模型工具,適合在 DSH 裏做站點工作站擴展時先對齊規範、再抄模板外殼。社區目錄頁與源碼倉庫如下,細節以 README 與 assets/spec.md 爲準。

  • 目錄頁:https://www.skillhub.cn/plugins/pierrotto12138-code/dsh-workstation-spec
  • GitHub:https://github.com/pierrotto12138-code/dsh-workstation-spec
羽毛球分组比赛记分
小程序二维码

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

小夜