dsh-floating-editor:DSH 网页界面里的浮窗文本编辑器

前言

在 DSH 里做智能体或插件开发时,经常要在网页控制台旁边改配置、记任务、对照日志改一小段文本。切到系统记事本或单独开一个 IDE 窗口,上下文容易断;若只在浏览器里临时塞一个 textarea,行号、折行和空白字符又很难对齐。DeepSeek Harness 的 web 侧可以挂客户端插件,把 UI 直接嵌进常驻页面。

下面介绍维护者 abluefan 的 dsh-floating-editor(分类:客户端):一个可拖动、可调透明度与字体的浮窗编辑器,内核为 CodeMirror 6,带多根文件夹树,并通过 Host 侧 HTTP API 读写本地文件。该插件于 2026-09-26 由原先的动态 Cordis 插件 floating-editor 固化为正式包;2026-09-27 起编辑区改为 CM6,行号、折行与空白字符由 CM6 统一排版,不再使用「textarea + 叠加层」方案。

这是什么

dsh-floating-editor 是常驻 DSH 网页界面的浮窗文本编辑器:支持读写的原子保存、多根文件夹树(Notepad++「Folder as Workspace」风格)、行号与空白字符可视化,以及一键用 Notepad++、资源管理器或命令行处理当前文件。窗口可八向缩放、标题栏拖动,收起到迷你条后展开不丢文档、滚动位置、光标与 undo 历史。

插件拆成 Host(index.js,同源 HTTP API)与 Client(lib/client.js,浮窗 UI);CM6 以 lib/vendor/cm6.bundle.js 形式打包为 window.CM6。运行时设置写入插件目录下的 settings.json。当前 package 版本为 0.2.0,要求 dsh >= 0.2.1-rc.2,许可证 MIT。

核心功能

编辑与文件

  • 读文件、原子写回;Ctrl+S 或工具栏「保存」,未保存时标题栏文件名旁带 *。
  • 路径输入框回车打开;「浏览…」调用 Windows 原生选文件框。
  • 行尾符保持文件原本的 CRLF / LF,保存时原样写回,不静默转换。
  • Alt+Z 或工具栏切换自动换行;空白字符以 CM6 装饰显示 · / →,不改变真实字符宽度。
  • 字号下拉 8–23px(步进 0.5,共 31 档);浮窗内 Ctrl+滚轮 可调字号;字体列表来自注册表枚举(含中文显示名)。
  • 底色、字色、透明度(Alpha 0–100%)可调;行号栏底色全透明,横向滚动时行号栏会淡出。

文件夹树与外部工具

  • 多根树:点目录展开/收起,点文件打开;打开文件时可自动把所在目录加为根;右键可添加/移除根目录(细节见仓库 docs/TREE.md)。
  • 「np++」用 Notepad++ 打开同一文件(外部程序不受插件沙箱约束)。
  • 每 2 秒检查文件 version:本地无改动则自动重新载入;本地有未保存改动则只提示、不覆盖。

窗口行为

  • 标题栏拖动;右下角与四边四角热区 resize。
  • 标题栏 — 收成迷你条 [ 文件名 ] [+],再点 + 展开;收起时仅 display:none,不卸载组件。

位置、大小、字体、颜色、换行、空白字符、树宽度、根列表、可写开关、上次打开文件等会持久化,字段说明见 docs/API.md。维护文档 docs/PITFALLS.md 记录了开发中实际踩过的坑,改源码前值得通读。

安装与启用

推荐从社区目录安装:在 awesome-dsh-plugin 找到本插件,或在 DSH 插件 → 发现 中搜索 dsh-floating-editor 并安装。

若包已发布到 npm,也可在 web profile 下执行:

dsh plugin --profile web add dsh-floating-editor

执行上述命令后,bundles 层会读取包内自带的 cordis.patch.yml,不要再在 cordis.patch.yml 里手写同 id 的 insert,否则同一插件会被挂载两次,DSH 启动会失败。

本地开发可手动复制插件目录到 $DSH_HOME/profiles/web/node_modules/dsh-floating-editor/,并在 $DSH_HOME/profiles/web/cordis.patch.yml 增加:

- insert:
    - id: floating-editor
      name: 'dsh-floating-editor'

然后重启 DSH,或让 Loader 重载配置。手动复制与 dsh plugin add 不要同时使用。

安装前请自行查看 GitHub 源码与 MIT 许可证;插件 Host 侧 API 以当前 DSH 进程权限访问文件系统,只应在可信环境中启用。

典型用法

目标 操作
打开文件 左侧树点击;或路径框输入后回车;或「浏览…」
把浮窗外的目录纳入树 右键树中目录 →「加为根目录」;打开任意文件时也会自动加入其所在目录
保存 Ctrl+S 或「保存」
调字号 浮窗内 Ctrl+滚轮,或工具行 Size 下拉
外部改同一文件 点「np++」,改完后插件会探测变更;有本地未保存改动时不会静默覆盖
暂时腾出页面空间 标题栏 — 收起;迷你条上 + 再展开

改 Host 代码(index.js)需重启 DSH;改 Client(如 lib/client.js)需在页面 Ctrl+Shift+R 强刷后才会生效。

适用场景与注意

适合需要在 DSH web 界面旁长期开着一个小编辑器、频繁改本地文本或配置、又希望有行号、折行与文件夹树的人。Windows 侧「浏览…」、Notepad++、资源管理器等集成在资料中按 Windows 环境描述;其他平台以仓库当前实现为准。

插件不是 DeepSeek 或幻方官方组件;社区目录(如 skillhub.cn、awesome-dsh-plugin)为独立生态站点。GitHub 仓库星标数为 0(以目录页信息为准),使用前请自行评估维护节奏与 docs/MAINTAIN.md 中的已知限制。

结尾

dsh-floating-editor 把 CM6 浮窗编辑、多根文件树和可调视觉参数收进 DSH 客户端插件,避免每次重启 DSH 丢失临时 UI。更多 HTTP API、树规则与维护说明见仓库 docs/。

  • 目录页:https://www.skillhub.cn/plugins/abluefan/dsh-floating-editor
  • GitHub:https://github.com/abluefan/dsh-floating-editor
羽毛球分组比赛记分
小程序二维码

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

小夜