deepseek-harness-desktop/packages/skins/miku

156Star5Fork6Issue0Watching

为 DSH Web GUI 提供初音未来主题皮肤:蓝紫洋红渐变 + 毛玻璃面板 + 可换背景图 + 亮暗双主题,纯呈现层可热插拔。

机审证据安装命令仓库已核验dsh-plugin Topic许可证READMEAI 百科

此插件是大仓库 ningbainb/deepseek-harness-desktop 的子包,星数与活跃度统计的是整个仓库。

语言
TypeScript
License
BSD-3-Clause
分支
main
ai-agentai-coding-assistantcodexdeepseekdeepseek-harnessdesktop-appdshdsh-plugin

安装

$ dsh plugin --profile web add github:ningbainb/deepseek-harness-desktop/packages/skins/miku

在终端中运行以上命令,通过 dsh CLI 安装此插件。可在右上角切换 Profile。 第一次用 dsh?看这篇新手教程

对话式安装

帮我安装 DeepSeek Harness 插件 ningbainb/deepseek-harness-desktop/packages/skins/miku:先查看仓库 https://github.com/ningbainb/deepseek-harness-desktop.git 确认安全性,然后执行安装命令并验证插件加载成功。

把这段指令粘贴给 DSH Web GUI 里的助手,由它代你完成安装与验证。

本文描述的是 ningbainb/deepseek-harness-desktop 仓库中的初音未来皮肤子包packages/skins/miku

一句话定位

为 DSH Web 图形界面换上一套初音未来主题外观(蓝紫洋红渐变、半透明毛玻璃、可换背景图、亮暗双主题),皮肤只动样式不动逻辑,可以随时热插拔地装上和卸下。

核心能力

  • 将 DSH Web GUI 整体换肤为蓝紫洋红渐变主题,主色 #2e9bff → #9b5dff → #ff4da6,贯穿标题栏和按钮
  • 在网页背景上铺一张原创的电子歌姬插画(1920x1080 SVG),作为整张桌面的"壁纸"
  • 把侧边栏、面板、输入框、设置弹窗统一改成半透明毛玻璃效果,让背景图从后面透出来
  • 在网页顶部注入自定义标题栏(音符图标 + 01 编号徽标 + 装饰窗口按钮),底部注入状态栏(声波波形 + 「MIKU 01 / 声库就绪 / VOCALOID 正式版」状态条目)
  • 同时提供亮色(蓝粉晴空)和暗色(霓虹蓝紫夜)两套主题,跟随 DSH 自身的明暗切换自动热切换
  • 自带一枚音符图标的 favicon,替换浏览器标签页图标
  • 内置自定义背景图插画以 data URI 形式内嵌,皮肤包本身零静态资源

技术实现

  • 语言: TypeScript (JSX/TSX),目标 ES2024,纯转译(无类型检查)
  • 关键依赖: @deepseek-ai/cordis(仅类型导入)、lightningcss(构建期把 CSS Modules 压进 bundle)
  • 架构模式: cordis bundle 包形态,cordis.patch.yml 向 web 插件名单插入 ui-skin-miku 一行;src/index.ts 是 host 半区(空壳 no-op),src/client/index.ts 是浏览器半区,浏览器侧 apply(ctx) 通过 ctx.effect(() => () => ...) 注册 disposer 实现严格回收
  • 入口文件: src/client/index.ts(皮肤实际生效入口);src/index.ts 仅暴露空的 apply() 占位

适用场景

喜欢初音未来/VOCALOID、想把 DSH Web 界面装饰成蓝紫主题氛围的个人用户;以及想自己换一张背景图、给工位增加仪式感、又不想动 DSH 源码或影响模型调用的普通用户。如果只是想换个浅色或深色基调、不追求二次元风格,可以选更克制的皮肤(如官方默认)。

前置依赖与兼容性

依赖最低版本说明
Node.js^22.19.0>=24.0.0来自 monorepo 根 package.json#engines,miku 包未单独声明
pnpm>=9仅构建期需要,运行时无关
DSH未声明仅要求宿主运行了 dsh web 服务(默认 http://127.0.0.1:3080),未指定具体 DSH 版本号
平台跨平台浏览器半区皮肤,任何能跑 DSH Web GUI 的设备都能用
原生模块纯 DOM/CSS,不依赖任何 node-gyp 原生扩展

安装方式

dsh plugin --profile web add github:ningbainb/deepseek-harness-desktop/packages/skins/miku

安装后通过 dsh-skin use miku 激活,激活为互斥(多皮肤只能启用一个),切换后刷新页面即可。

配置项

本插件无需额外配置。
所有外观参数(背景图、配色、状态栏文案)都硬编码在 src/client/art.tssrc/client/miku.module.css 中,不暴露 Schema / Settings 选项。要改背景图,请编辑源码后重建;不要在 DSH Settings 面板里找——皮肤不会注册任何配置项。

常见问题

Q: 安装后会自动启用吗?会和官方默认皮肤冲突吗?

A: 不会自动启用,也不会冲突。皮肤之间是互斥的:执行 dsh-skin use miku 才会激活,想回到默认就 dsh-skin use official,切换由 scripts/dsh-skin(写入 profile 的 cordis patch 与 profile 软链)管理。

Q: 关掉皮肤后,网页会不会留一堆样式或元素?怎么撤回?

A: 不会。apply() 通过 cordis 的 ctx.effect 注册了 disposers:body 上的 data-dsh-miku 属性会移除,注入的标题栏、状态栏、favicon 节点都会被 remove()document.title 在不是别的来源改过的情况下也会还原——皮肤不写自己不会收回的东西。

Q: 我想换成自己的初音壁纸,该改哪里?

A: 把图片(如 bg.png)放到本仓库下,跑 node scripts/embed-bg.mjs(脚本会把图片转成 WebP 并写入 src/client/art.tsMIKU_ART 常量),然后 pnpm build 重构建、刷新页面即可。如果脚本不可用,也可以手动把图片 base64 化后直接替换 MIKU_ART 的值。

Q: 这个皮肤会不会触发额外的模型请求、记录行为或影响其他插件?

A: 不会。皮肤是纯呈现层:cordis 侧不注入服务、不发事件、不监听模型请求,只操作 DOM(document.body、自定义标签、CSS 变量、<link rel="icon"><title>),跟其他插件互不干扰。

Q: 暗色模式下背景图会变暗看不清吗?

A: 不会变暗。皮肤用 MutationObserver 监听 data-ds-dark-theme 属性变化:切到暗色时只叠一层非常薄的蓝色薄纱(SCREEN_DARK),原插画保持鲜艳,文字依然清晰可读。

Q: 卸载皮肤后 favicon、网页标题会恢复吗?

A: 会。皮肤首先把原 favicon 路径和原 document.title 缓存下来,dispose 时再写回去;只有当 document.title 仍等于皮肤自己写过的那个文案时才会回滚,避免覆盖宿主后续设置的会话标题。

上手难度

入门 — 复制一条 dsh plugin add + 一条 dsh-skin use miku 即可启用;想换背景图也只是塞一张图片再跑一行脚本,不需要懂 cordis、react 或 DSH 内部。

已知问题与限制

暂无已知问题。
本包源码中未检索到 TODO / FIXME / HACK / XXX 注释;唯一需要手动介入的"限制"是:包内 UI 文案(如状态栏 MIKU 01 / 声库就绪 / VOCALOID 正式版、页面标题 初音未来 · DeepSeek 在线)写在 src/client/index.ts 的常量里,要改成别的语言需要改源码并重建,而不是通过配置面板。

收录徽章

Listed on deepseek-plugin.org
[![Listed on deepseek-plugin.org](https://img.shields.io/badge/listed_on-deepseek--plugin.org-007EC6)](https://deepseek-plugin.org/plugins/ningbainb/deepseek-harness-desktop/packages/skins/miku)

把这段 markdown 粘贴到你的 GitHub README,链接回本插件详情页。徽章只声明已被本站收录,不代表安全认证。

返回插件目录