免费获取学习方案
ARTICLE DETAIL

资讯详情

深耕编程基础知识与建站技术分享的一线实战洞察。

深度定制DSH-better-sidebar:声明式设置、10款皮肤兼容与19语言多语言完全指南

深度定制DSH-better-sidebar:声明式设置、10款皮肤兼容与19语言多语言完全指南 深度定制DSH-better-sidebar声明式设置、10款皮肤兼容与19语言多语言完全指南【免费下载链接】DSH-better-sidebar开放的侧边栏底座支持三方拓展注册新侧边栏页面。内置文件渲染编辑/终端/侧边对话/Git/子代理页面 Open sidebar foundation, supports third-party extensions to register new sidebar pages. Built-in file rendering/editing, terminal, side chat, Git, and sub-agent pages.项目地址: https://gitcode.com/gh_mirrors/ds/DSH-better-sidebarDSH-better-sidebar 是一个开放的侧边栏底座支持三方拓展注册新侧边栏页面内置文件渲染编辑、终端、侧边对话、Git 与子代理页面。本篇完全指南带你深度掌握它的三大定制能力声明式设置每个页面独立开关 二级设置弹窗、皮肤兼容令牌驱动自动跟随 10 款皮肤零适配、19 语言多语言跟随 DSH 语言实时切换。无需写代码跟着本文即可把侧边栏调成最顺手的形态。⚙️ 声明式设置一键开关每个侧边栏页面DSH-better-sidebar 的设置页「侧边卡片」分区是注册表驱动的声明式清单——不再硬编码固定几行而是自动列出当前注册的全部侧边栏内容与文件查看器每项都是一个可点击的卡片开关来源src/client/SideCardSection.tsx。开关内置侧边栏页面打开设置页你会看到按顺序排列的内置 tab资源管理器、Git、终端、子代理、编辑器、差异视图等。每张卡片显示图标 标题 类型标识点击整卡即切换启用/禁用启用卡片呈品牌色描边 紧凑开关滑块指示禁用卡片变中性描边相关入口即时消失如禁用 Git 后新建 Tab 菜单里的 Git 选项马上不见。值得留意的是保留式语义禁用只影响新打开的页面已经打开的 tab 会继续保留渲染不会粗暴关闭。新会话的默认布局也会随之调整——例如禁用资源管理器后新会话面板初始为空。这一整套开关状态持久化在偏好文档的tabsEnabled字段中v0.4.1 引入设计见 docs/plans/2026-08-11-declarative-sidebar-settings-design.md。管理文件预览查看器8 个内置文件查看器图片 / Markdown / HTML / PDF / docx / xlsx / pptx / 代码 / 二进制下载同样以卡片形式列出卡片描述行显示它认领的扩展名。禁用某个查看器后对应文件会自动落到下一个匹配的查看器或下载入口不会“打开失败”。二级设置卡片底部「功能设置」弹窗声明了相关设置的卡片底部有一条全宽的设置条齿轮 「功能设置」标签点击打开原生弹窗查看嵌套选项例如页面相关设置子代理检测到子代理时自动打开面板终端为模型注入终端工具terminal_*、字体族与字号浏览器外链拦截策略、沙箱开关父级卡片关闭时其嵌套设置行自动隐藏但值会被保留重新启用后原样恢复——不会出现“设置悄悄被清掉”的意外。 皮肤兼容自动跟随 10 款皮肤零适配DSH-better-sidebar 采用令牌驱动的皮肤方案面板表面直接消费 DSH 标准设计令牌--dsw-alias-*语义层而不自建一套颜色体系。这意味着 dsh-web-ui 皮肤中心的10 款皮肤全部开箱兼容——切换皮肤时侧边栏自动跟随换肤包括玻璃质感的半透明背景效果不需要为任何一款皮肤单独写适配代码方案细节见 docs/plans/2026-08-15-skin-compat-design.md。终端与编辑器的透明度回退皮肤常用半透明玻璃色若终端表面直接透出去文字会叠在皮肤背景上难以阅读。DSH-better-sidebar 在 src/client/theme.ts 中实现了智能判断当令牌值是透明色、CSS 重置关键字或alpha 低于 0.9 的半透明颜色时终端/编辑器自动回退为不透明底色而接近不透明的玻璃值如 0.96 瓷器玻璃则放行让皮肤仍能控制表面观感。这一阈值兼顾了“不挡字”与“不破皮”两个目标。 多语言支持19 语言实时切换跟随 DSH 的语言偏好界面文案不再读浏览器语言而是跟随 DSH 的语言设置ctx.locale服务在 DSH 设置页切换语言侧边栏全部文案实时切换无需刷新。即使浏览器语言与 DSH 偏好不一致比如 DSH 设为中文、浏览器为英文侧边栏也会正确显示中文设计见 docs/plans/2026-08-12-follow-dsh-i18n-design.md。内置词典以命名空间betterSidebar注册进 DSH 的 i18n 注册表核心在 src/client/locales.tsMarkdown 预览里的复制按钮等文案也同步跟随。19 语言全量词典覆盖通过可选的huanlin/dsh-plugin-better-localeDSH-better-sidebar 提供19 种第三语言的全量覆盖每种约 340 个词条日语、德语、法语、葡萄牙语、韩语、阿拉伯语、印地语、印尼语、土耳其语、越南语、泰语、俄语、意大利语、荷兰语、瑞典语、波兰语以及繁中港式、繁中台式和澳门葡式。每种语言对应独立词典文件如 src/client/locales-ja.ts、src/client/locales-ko.ts、src/client/locales-ru.ts 等共 19 个文件。几个设计细节值得了解覆盖借用 DSH 英文槽位生效DSH 语言为 en 时中文环境下完全惰性界面不会混语言词典同时注册进 better-locale外部插件调用ctx.locale.lookup(betterSidebar, key)也能拿到覆盖文本未安装该插件时整段逻辑 no-op中英文行为完全不变——零副作用。 进阶给你的插件也加声明式设置如果你是插件开发者v0.12.0 起设置 seam 已完全开放注册 tab 或文件查看器时可携带settings声明toggles绑定宿主偏好字段的开关行pluginToggles插件自有设置行开关/文本/数字/下拉值持久化在pluginSettings[id]分桶中无需宿主 schema 字段render完全自定义的设置面板可读写自己的偏好。tab 与 viewer 卡片都能挂齿轮设置入口完整的字段清单与匹配算法见官方接入指南第 8 节docs/external-plugin-guide.md。内置页面与查看器如何声明这些设置的参考实现在 src/client/builtins/ 目录下。 完全指南小结定制维度能力关键入口声明式设置每个 tab/viewer 独立开关保留式禁用语义二级设置弹窗设置页「侧边卡片」SideCardSection.tsx皮肤兼容令牌驱动10 款皮肤零适配跟随终端/编辑器透明度回退theme.ts、skin-compat 设计文档多语言跟随 DSH 语言实时切换19 语言全量词典覆盖locales.ts、i18n 设计文档插件扩展pluginToggles / render 自定义设置面external-plugin-guide.md只需在 DSH 设置页切换、在侧边卡片点一点开关就能把 DSH-better-sidebar 深度定制成专属于你的工作台——声明式设置管“开什么”皮肤兼容管“长什么样”19 语言多语言管“说什么话”。【免费下载链接】DSH-better-sidebar开放的侧边栏底座支持三方拓展注册新侧边栏页面。内置文件渲染编辑/终端/侧边对话/Git/子代理页面 Open sidebar foundation, supports third-party extensions to register new sidebar pages. Built-in file rendering/editing, terminal, side chat, Git, and sub-agent pages.项目地址: https://gitcode.com/gh_mirrors/ds/DSH-better-sidebar创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表