@mdalboni/dsh-mobile:爲 DSH Web 界面補齊移動端視口與滾動行爲

前言

DeepSeek Harness(DSH)的 Web GUI 在手機瀏覽器裏打開時,常見問題是整頁跟着手勢上下「橡皮筋」滾動、虛擬鍵盤頂起佈局時頁面平移而不是收縮可視區,以及輸入框字號過小觸發 iOS/Android 自動縮放。這些體驗問題並不寫在業務邏輯裏,卻直接影響在移動端查看會話、切換側邊欄和輸入消息。下面介紹社區客戶端插件 @mdalboni/dsh-mobile(倉庫 mdalboni/dsh-mobile),它通過前端補丁在 DSH Web 側鎖定視口、約束過滾動,並處理鍵盤與側邊欄等移動端細節。

這是什麼

@mdalboni/dsh-mobile 由 mdalboni(Maxwell Dalboni)維護,歸類爲 客戶端 插件:在 DSH Web 平臺加載時立即生效(immediately: true),不替代服務端能力,只調整瀏覽器裏的佈局與交互。當前 npm 包版本爲 1.0.0,許可證 MIT;要求 DSH 引擎 >=0.2.1-rc.3(與 peerDependencies 中的 @deepseek-ai/dsh 一致)。

插件目錄頁:skillhub.cn/plugins/mdalboni/dsh-mobile。該目錄爲社區生態站點,與 DeepSeek / 幻方無官方從屬關係。

核心功能

資料中列出的能力如下,均針對 DSH Web GUI:

  1. Viewport Lock(視口鎖定)
    防止 html, body 隨滾動或回彈進入應用下方的空白黑邊區域。

  2. Overscroll Containment(過滾動 containment)
    在 [data-conversation-scroll] 上使用 overscroll-behavior-y: contain,把滾動手勢限制在會話滾動容器內。

  3. Virtual Keyboard Resizing(虛擬鍵盤縮放縱)
    配置 interactive-widget=resizes-content,使虛擬鍵盤以調整視口高度的方式呈現,而不是整頁平移。

  4. Sidebar Auto-Retraction(側邊欄自動收起)
    在移動端點擊會話區域任意處,或在會話列表選中一行時,自動摺疊側邊欄。

  5. Input Zoom Prevention(輸入框防自動縮放)
    對移動端視口上的文本輸入強制最小 16px 字號,降低 iOS/Android 聚焦輸入時的自動放大。

README 中含三張截圖(聊天視圖、鍵盤打開、側邊欄打開),路徑在倉庫 assets/ 下,便於對照上述行爲。

安裝與啓用

插件作爲 DSH web profile 的 bundle 安裝;安裝命令須使用文檔原文,勿自行拼接 github:owner/repo 形式。

方式一:編輯 web profile 的 package.json

在 ~/.dsh/profiles/web/package.json 中加入依賴與 bundle:

{
  "dependencies": {
    "@mdalboni/dsh-mobile": "^1.0.0"
  },
  "dsh": {
    "profile": {
      "bundles": [
        "@mdalboni/dsh-mobile"
      ]
    }
  }
}

保存後按你現有的 DSH web profile 流程安裝依賴並重啓或刷新 Web GUI,使 bundle 加載。

方式二:DSH CLI

dsh plugin add @mdalboni/dsh-mobile

方式三:cordis.patch.yml

在 profile 或 patch 配置中增加:

- id: dsh-mobile
  name: '@mdalboni/dsh-mobile'

包內通過 dsh.bundle.patch 指向 ./cordis.patch.yml,與 Cordis 補丁機制一致。

典型用法

該插件 無額外配置項 暴露在 README 中:啓用 bundle 後,客戶端腳本在 Web 平臺自動注入樣式與行爲。開發與驗證時可按 README 建議關注:

  • 會話列表與 [data-conversation-scroll] 區域的滾動是否不再帶動整頁;
  • 手機瀏覽器中打開輸入框時視口是否隨鍵盤收縮;
  • 點開會話或點按聊天區後側欄是否自動收起。

本地包提供 node --test test/index.test.js 測試腳本,供維護者在發佈前自檢;終端用戶僅需保證 web profile 已包含 @mdalboni/dsh-mobile。

適用場景與注意

適合誰: 經常在手機或平板瀏覽器裏使用 DSH Web 界面、需要穩定視口和會話區滾動的用戶;分類爲「客戶端」,與僅在服務端運行的插件互補。

權限與安全: 插件隨當前 DSH 進程的 Web 客戶端加載,修改的是頁面 DOM 與 CSS 行爲。安裝前應查看 GitHub 倉庫 源碼(入口 client.js、cordis.patch.yml)並確認 MIT 許可證是否符合你的合規要求。

版本: 依賴 @mdalboni/dsh-mobile ^1.0.0 與 DSH >=0.2.1-rc.3;升級 DSH 主版本時需對照 peerDependencies 是否仍滿足。

生態: DSH 採用「一切皆插件」思路;本插件通過 SkillHub 等社區目錄分發,星標與關注度以各站點展示爲準(目錄線索爲 0 星),選型時以功能說明與源碼爲準即可。

結尾

經過上面的步驟,在 web profile 中啓用 @mdalboni/dsh-mobile 後,可在不改變 DSH 核心業務的前提下,改善移動端視口鎖定、過滾動、虛擬鍵盤與側邊欄等細節。更多說明見目錄頁 skillhub.cn/plugins/mdalboni/dsh-mobile 與 GitHub mdalboni/dsh-mobile。

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

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

小夜