DSH 网页版美化全家桶:10 套可换肤、极光毛玻璃动态背景、看板娘、任务看板、SSH 运维、Git 图谱、用量看板,一键安装。
- Language
- TypeScript
- License
- Apache-2.0
- Branch
- main
Install
$ dsh plugin --profile web add github:CAPTAIN1275/dsh-ui-webRun the command above in your terminal to install this plugin via the dsh CLI. You can switch Profile in the top-right corner. New to dsh? Read the beginner tutorial
一句话定位
DSH 网页版美化与增强套件:一次安装获得 10 套可切换皮肤(含动态背景的极光毛玻璃)、DeepSeek 娘养成宠物、任务看板、SSH 运维、Git 图谱、用量看板与设置扩展。它本身不直接提供业务逻辑,作为聚合载体把十余个子插件和皮肤中心一起挂入 DSH Web。
核心能力
- 10 套皮肤互斥切换:极光(Aurora)/ ths / xp / blue-fantasy / dragon-heir / minecraft / miku / trading / whale-song / skin-center,由皮肤中心统一管理(README.md:77-83)。
- 极光毛玻璃动态背景:URL 图片、本地图片、动图(GIF / WebP)、视频(mp4 / webm)皆可作背景,支持不透明度、模糊、静音开关;本地媒体持久化到
~/.dsh/skin-aurora-media/(packages/skins/aurora/src/index.ts:108-211)。 - 推理等级 Effort 滑块:在官方模型菜单的「推理等级」行弹出连续拖动滑块,附带 WebGL 火焰跟随、松手吸附、Low / Medium / High / Ultracode 状态(packages/skins/aurora/src/client/index.ts:285-338)。
- DeepSeek 娘养成宠物:4 级亲密度(幼鲸 / 伙伴 / 挚友 / 深海羁绊),Token 零食经济、每 30 分钟时长 +1、空闲随机气泡,支持摸头 / 喂食 / 改名 / 拖动(README.md:36-43)。
- 任务看板:侧边栏多列 kanban,任务可真实执行(驱动 agent 会话)、支持 5 段 cron 定时,数据存浏览器 localStorage(packages/dsh-task-board/src/index.ts:25)。
- SSH 远程运维:主机配置存
~/.dsh/dsh-ssh.json(可从~/.ssh/config导入),持久连接池提供 ssh_list / ssh_exec / ssh_upload / ssh_download / ssh_tunnel / ssh_cluster 工具,含 Web 终端(packages/dsh-ssh/src/index.ts:58)。 - 用量看板:累计 token / 调用次数 / 缓存命中 / 估算费用彩色卡、近 14 天趋势柱状图、按模型分布环形图、Top 20 会话排行(packages/dsh-usage-dashboard/src/index.ts:27-77)。
- 设置扩展:「Web UI 插件」分组面板聚合所有子插件开关 + 「人格设定」编辑(写入
~/.dsh/skills/catgirl-rp/SKILL.md,DSH 技能热加载)+「关于」版权页(README.md:44-52)。
技术实现
- 语言: TypeScript
- 关键依赖: @deepseek-ai/cordis(cordis 插件运行时) / @deepseek-ai/dsh-client-runtime(DSH 客户端 SDK) / @deepseek-ai/dsh-settings(设置面板) / schemastery(配置 schema 校验)
- 架构模式: cordis bundle 聚合包;
aggregate.yml是手写清单,scripts/aggregate.mjs把子包cordis.patch.yml的 insert 行汇入并写入本包 patch;host 半区零业务逻辑(apply 是空函数),浏览器半区是 DOM 兼容垫片 + 浅毛玻璃 AquaLayer(packages/dsh-web-ui-all/src/client/index.ts:17-83) - 入口文件: packages/dsh-web-ui-all/src/index.ts (host 空壳) / packages/dsh-web-ui-all/src/client/index.ts (compat shim) / packages/skins/aurora/src/index.ts (极光皮肤宿主) / packages/skins/aurora/src/client/index.ts (极光浏览器端)
适用场景
刚接触 DSH 网页版、想要默认获得一套视觉与功能增强(皮肤、动态背景、宠物、看板、远程操作、用量统计)的用户;以及已经在用 DSH 但希望让 Web 界面更接近桌面 IDE 体验(毛玻璃、动态视频背景、实时令牌统计)的进阶用户。
前置依赖与兼容性
| 依赖 | 最低版本 | 说明 |
|---|---|---|
| DSH | 0.1.0-rc.6 | 所有子包 peerDependencies 锁定 @deepseek-ai/dsh-* 为 ^0.1.0-rc.6,DSH 自身版本通过 SDK 隐式锁定 |
| Node | ^22.19.0 || >=24.0.0 | packages/dsh-git-graph/package.json、packages/dsh-pet/package.json、packages/dsh-ssh/package.json 的 engines 字段 |
| 平台 | 跨平台(仅 web) | 仅作用于 DSH 的 web profile;浏览器端运行,宿主端跨平台 |
| 原生模块 | 无 | 全部走 cordis bundle + Web DOM API,无 native binding |
安装方式
dsh plugin --profile web add github:CAPTAIN1275/dsh-ui-web
配置项
| 配置 | 类型 | 说明 | 默认值 |
|---|---|---|---|
| 极光背景启用 | 开关 | 关闭后恢复纯渐变背景,不再渲染自定义媒体层 | 开启 |
| 极光背景 URL | 字符串 | 自定义背景地址:URL 图片 / 本地路径 / 视频流式 URL | 空 |
| 极光背景类型 | 单选(图片 / 视频) | 决定走 CSS background-image 还是 <video> 流 | 图片 |
| 极光不透明度 | 数值(0-1) | 自定义背景的不透明度 | 0.8 |
| 极光模糊 | 像素 | 自定义背景的高斯模糊半径 | 0 |
| 极光视频静音 | 开关 | 仅在背景类型为视频时生效,控制 <video> 是否静音 | 静音 |
| 皮肤中心背景遮罩 | 数值(0-100) | 全屏皮肤背景后的半透明遮罩浓度 | 0 |
| 看板娘是否可见 | 开关 | 关闭后隐藏宠物组件 | 开启 |
| 看板娘尺寸 | 像素(80-320) | 宠物渲染尺寸 | 160 |
| 看板娘位置 | 数值(距右/距下 0-600) | 屏幕右下角的距离 | 右 24 / 下 20 |
| 看板娘名字 | 字符串(1-16 字符) | 显示在宠物头顶 | 默认名字 |
| 任务看板启用 | 开关 | 总开关;关闭后侧边栏入口隐藏、定时调度停止 | 开启 |
| 任务看板向模型广播 | 开关 | 是否在系统提示词里告诉模型本插件存在 | 开启 |
| SSH 启用 | 开关 | 总开关;关闭后主机配置不加载、agent 工具不可用 | 开启 |
| SSH 向模型广播 | 开关 | 是否在系统提示词里告诉模型本插件存在 | 开启 |
常见问题
Q: 安装之后还要做什么才能让插件生效?
A: 重启 DSH Web 即可。如果使用源码模式,需要在仓库内 pnpm install && pnpm -r build,再 node scripts/link-profile.mjs 把本地包链接进 profile,最后重启 DSH Web。
Q: 只想装其中一两个子插件怎么办?
A: 直接装对应独立子包即可(如 @captain1275/dsh-pet、@captain1275/dsh-client-ui-task-board),不必走本全家桶;本聚合包会一并激活全部子插件。
Q: 极光(Aurora)皮肤的自定义背景支持哪些格式?
A: 支持 URL 图片、本地图片、动图(GIF / WebP)、视频(mp4 / webm)。本地媒体上传到 ~/.dsh/skin-aurora-media/,按内容哈希命名(SHA1 前 16 位)避免重复,并通过 /api/skin-aurora/media/<hash>.<ext> 流式访问。视频走 HTTP Range,请求即拖动进度条都能正常播放。
Q: 自定义背景视频在播放时进度条拖不动怎么办?
A: 极光皮肤已实现 HTTP Range(206 Partial Content),理论上视频可拖动。如果仍卡顿,说明 DSH Web 较旧未透传 Range 头,可尝试刷新或重启 DSH Web。
Q: 设置里的「人格设定」是什么?
A: 一个可编辑的常驻系统人格,编辑后写入用户级技能 ~/.dsh/skills/catgirl-rp/SKILL.md,DSH 技能系统热加载;新建会话都会以该人格回应。内置「小咪」猫娘人格,含好感度系统与模式切换指令;可在对话中用「退出角色扮演模式 / 进入角色扮演模式」临时切回普通助手。
Q: 任务看板里的定时任务为什么错过了就不再补跑?
A: 定时调度跑在浏览器端,需要 DSH Web 标签页打开才会触发;关闭后浏览器不在线,错过即跳过,不会补跑历史任务。
Q: SSH 插件会保存我的主机密码吗?
A: 是。主机密码以明文存到 ~/.dsh/dsh-ssh.json,文件权限 0600(仅当前用户可读写)。如对安全敏感,请改用密钥认证(passphrase 也支持)。
Q: 安装完成后想去掉某个子插件怎么办?
A: 当前聚合包无法只挑部分子插件。如需剔除某个,进入 DSH Web 设置 → Web UI 插件分组,关闭该子插件对应的开关即可(无需卸载);要彻底移除请改用独立子包安装方式。
上手难度
入门 — 一条命令安装、重启即生效;想要自定义背景或调整宠物时通过 Web UI 设置面板即可完成,无需手写配置或命令行。
已知问题与限制
- 全家桶激活即全部子插件一并加载,无法只挑选部分;如需部分安装请改用对应独立子包(README.md:73-89)。
- 任务看板的定时调度依赖浏览器端,需 DSH Web 标签页保持打开;标签页关闭期间错过的任务不会补跑(packages/dsh-task-board/src/index.ts:25)。
- SSH 插件以明文保存主机密码到
~/.dsh/dsh-ssh.json(文件权限 0600);安全敏感场景请改用密钥认证(packages/dsh-ssh/src/index.ts:58)。 - 极光皮肤的自定义背景视频通过
/api/skin-aurora/media/...流式返回,最大单次上传 200MB(packages/skins/aurora/src/index.ts:114-119)。 - 皮肤中心 CLI 同步皮肤注册表的实现目前只读
skin.json中的wiring.bundleWired标记;如未来需要从 profile bundle 反向检测已安装皮肤需要扩展(packages/skins/skin-center/src/skin-switch.ts:241-249)。
基于 zhu1090093659/dsh-web-ui(Apache-2.0)开发的 DeepSeek Harness(DSH)Web UI 插件套件。全套 22 个包已发布到 npm(
@captain1275/*)。
DSH Web UI 全家桶为 DeepSeek Harness 的 Web 界面提供一系列插件与皮肤:极光毛玻璃皮肤、任务看板、 SSH 运维、右侧文件/变更面板、Git 图谱、移动端远程控制、DeepSeek 娘看板娘(养成系)、实时令牌统计, 以及皮肤中心。所有插件既可独立安装,也可通过聚合包一次装齐。
极光 Aurora 皮肤效果(沉浸光感 / 深色 / 浅色)



特性
极光(Aurora)皮肤(支持动态背景)
- 毛玻璃输入框:高斯模糊(backdrop-filter 30px)+ 半透明玻璃底 + 细边框 + 内高光
- 自定义背景:URL / 本地图片 / 动图(GIF/WebP)/ 视频(mp4/webm) / 透明度 / 模糊调节,
深浅两套极光渐变;视频背景支持静音开关、本地文件持久化(存
~/.dsh/skin-aurora-media/,刷新不丢) - 仿Claude Code推理等级滑块:点击模型菜单的「推理等级」弹出 Effort 滑块面板——无极拖动、松手吸附、 WebGL 火焰跟随、OFF/MAX 刻度、Low/Medium/High/Ultracode 状态

- 用户消息气泡毛玻璃:与输入框统一的玻璃质感
DeepSeek 看板娘(养成系)
- 图片资源(社区同人资源,codex-pet-DeepSeek-girl)
- 养成系统:亲密度 4 级成长(幼鲸 / 伙伴 / 挚友 / 深海羁绊)、升级庆祝气泡、进度条、 Token 零食经济、使用时长成长(每 30 分钟 +1)
- 待机随机气泡:空闲时随机说话(live2d 风格文案)
- 摸头 / 喂食 / 改名 / 拖动,召唤按钮(live2d 同款贴边滑出)
Skill 人格设定
- 设置「人格设定」:开关启用/禁用常驻人格,编辑技能名、描述与人格正文
- 一键生效:保存后写入用户级技能
~/.dsh/skills/catgirl-rp/SKILL.md,DSH 技能系统实时加载, 所有新对话自动以该人格回应(含语气、动作表达、互动规则) - 内置猫娘人格:默认提供「小咪」猫娘人格(常驻生效、好感度系统、模式切换指令),可自由改写
- 可临时退出:对话中说「退出角色扮演模式」即切回普通助手,说「进入角色扮演模式」恢复

用量看板
- 彩色统计卡:累计 token、调用次数、缓存命中、估算费用(按 DeepSeek 官方定价)
- 近 14 天趋势:每日 token 消耗柱状图
- 模型分布:各 provider/model 用量环形图 + 图例
- 会话排行:Top 20 会话(标题 / 模型 / 调用数 / token / 费用)
- 自动记录:对话时自动采集 token 用量(会话快照替换语义,不双计),存
~/.dsh/usage.json - 侧边栏入口:彩色柱状按钮打开全屏看板
功能插件
| 插件 | 功能 |
|---|---|
| dsh-task-board | 侧边栏任务看板:多列 kanban、真实执行(驱动 agent 会话)、定时执行(cron) |
| dsh-ssh | SSH 运维:主机管理、远程执行、SFTP 传输、隧道、集群并发、Web 终端 |
| dsh-aionui-panel | 右侧「预览 / 文件 / 变更」面板:文件树、多格式预览、git 操作、文件拖拽 |
| dsh-git-graph | 会话头部 git 分支选择器 + 提交图 |
| dsh-live-stats | 实时 token 估算与生成速度 |
| dsh-full-stats | 完整统计行:覆盖官方统计(不省略)+ 运行状态指示 + 自定义状态文本(含替换官方 Deep diving...) |
| dsh-usage-dashboard | 用量看板:彩色统计卡 / 近 14 天趋势 / 模型分布 / 会话排行 / 费用估算 |
| dsh-web-ui-settings | 设置页「Web UI 插件」配置组 + 「人格设定」+「关于」版权页 |
| dsh-web-ui-all | 聚合包:一键安装全部插件 |
皮肤中心
10 套皮肤(ths / xp / blue-fantasy / dragon-heir / minecraft / miku / trading / whale-song / aurora / skin-center),支持皮肤启用互斥管理与一键切换。
其余皮肤(ths / xp / blue-fantasy / dragon-heir / minecraft / miku / trading / whale-song) 为上游 dsh-web-ui 自带皮肤。
安装
方式一:npm(推荐,已发布)
# 在 DSH profile 目录(~/.dsh/profiles/web)安装聚合包
npm install @captain1275/dsh-web-ui-all@0.2.8
然后在 profile 的 package.json 里把 @captain1275/dsh-web-ui-all 加入
dsh.profile.bundles:
{
"dsh": {
"profile": {
"bundles": [
"@deepseek-ai/dsh-base",
"@deepseek-ai/dsh-web-app",
"@captain1275/dsh-client-ui-skin-aurora",
"@captain1275/dsh-full-stats",
"@captain1275/dsh-web-ui-all"
]
}
}
}
重启 DSH 即生效。
方式二:从源码(开发)
git clone <your-repo-url> dsh-web-ui
cd dsh-web-ui
pnpm install
pnpm -r build
# 把本地包链接进 profile(junction)
node scripts/link-profile.mjs
开发
- 构建:
pnpm -r build(或pnpm --filter <package> build) - 新增皮肤:参考
packages/skins/aurora(skin.json+src/client+cordis.patch.yml), 然后用node scripts/skin-center-bundles重新生成注册表 - 聚合包 patch:编辑
packages/dsh-web-ui-all/aggregate.yml后node scripts/aggregate.mjs - 皮肤资产同步:
node packages/dsh-skins/build.mjs
目录结构
packages/
├─ dsh-task-board / dsh-ssh / dsh-aionui-panel / dsh-git-graph
├─ dsh-pet / dsh-live-stats / dsh-full-stats
├─ dsh-web-ui-settings / dsh-web-ui-all / dsh-skins
└─ skins/ # 皮肤源码(aurora、miku、ths 等)
scripts/ # 构建 / 注册表 / 链接工具
shared/ # 共享构建预设(tsdown.client.ts)
版权与许可
- 主体代码:zhu1090093659/dsh-web-ui,Apache-2.0
- 增强优化:@captain1275
- DeepSeek 娘精灵图:xpy12367/codex-pet-DeepSeek-girl, 社区同人资源,版权归原作者
- 人形图标:Font Awesome 6.7.2,CC BY 4.0
- 样式参考:live2d-widget(GPL-3.0,仅参考视觉风格,未搬用代码)
- 商标:DeepSeek 及其相关标识均为 DeepSeek 官方资产;本插件为社区开发者独立维护的非官方同人项目, 不代表 DeepSeek 官方立场。