后端前端容器编排运维【免费下载链接】dockgeA fancy, easy-to-use and reactive self-hosted docker compose.yaml stack-oriented manager项目地址https://gitcode.com/GitHub_Trending/do/dockge点击查看免费下载本指南以 Dockge 官方翻译说明frontend/src/lang/README.md为骨架面向希望将 Dockge 界面翻译为母语、或为语言下拉菜单新增一种语言的开发者与译者。读完你将掌握两条完整路径在 Weblate 协作平台上参与既有语言翻译的流程以及通过修改languageList与提交 JSON 翻译文件为 Dockge 接入全新语言的源码级操作并理解前端 i18n 运行时机制的底层原理。Dockge 前端国际化的整体架构Dockge 的前端基于 Vue 3 与 vue-i18n 构建翻译工作由三个核心部分协作完成语言清单与 i18n 实例frontend/src/i18n.ts 集中定义了languageList语言代码 → 本地化语言名与createI18n配置翻译词条文件frontend/src/lang/ 目录下每个语言一个 JSON 文件如en.json、zh-CN.json、ja.json内容为「界面字符串键 → 目标语言文本」的键值对运行时切换逻辑frontend/src/mixins/lang.ts 中的changeLang负责动态加载 JSON 并切换 locale。从源码可以看出Dockge 默认语言是英语en.json在 i18n.ts 中被直接导入作为初始messages其余语言文件则通过import.meta.glob(../lang/*.json)按需加载只有当用户切换语言时才真正拉取对应 JSON。如何参与翻译Webleate 协作流程翻译指南 给出的官方协作路径是通过 Weblate 平台完成这是社区翻译的推荐方式无需直接修改仓库文件。完整步骤如下访问 Weblate 平台打开 Dockge 项目所使用的 Weblate 翻译实例weblate.kuma.pet域名的 Dockge 项目。注册账号在 Weblate 上注册一个账户。关联 GitHub 邮箱确保你的 GitHub 邮箱与 Weblate 账户邮箱一致这样翻译贡献会正确归属到你的 GitHub 账号并在贡献者列表中得到展示。选择语言开始翻译在 Weblate 中选择你熟悉的语言逐条翻译界面字符串并提交。这一流程对普通译者非常友好翻译工作直接在 Web 界面完成词条同步、审校与合并都由平台与维护者处理译者无需搭建 Dockge 的开发环境。仓库根目录的 README.md 也明确指向了这份翻译指南说明这是项目官方认可的唯一翻译入口。翻译词条的文件格式约定若你更希望直接以文件形式贡献翻译可以参照既有语言文件的格式。以英文基准文件 frontend/src/lang/en.json 为例翻译文件是一个扁平的 JSON 对象顶层键与界面中$t(...)调用使用的字符串键一一对应{ languageName: 简体中文, Create your admin account: 创建你的管理员账号, authIncorrectCreds: 用户名或密码错误。, PasswordsDoNotMatch: 两次输入的密码不一致。, Repeat Password: 重复以确认密码, Create: 创建, signedInDisp: 当前用户 {0}, ... }需要注意两点格式约定languageName键是必填的它存储该语言的自称用该语言书写i18n.ts 在初始化时会把languageList中的语言名注入每个语言的messages而 Appearance.vue 的下拉菜单正是通过$i18n.messages[lang].languageName显示语言名的{0}是占位符如signedInDisp的Signed in as {0}运行时会被实际参数如用户名替换翻译时需保留占位符位置。如何新增一种语言到下拉菜单当现有语言列表中没有你想要的语言时翻译指南 提供了完整的四步操作。结合源码可以将其拆解为如下可执行流程第 1 步在 Weblate 上添加语言在 Weblate 的 Dockge 项目中添加该语言。这一动作会为该项目建立新的语言词条空间之后维护者可以在仓库中落盘对应的 JSON 文件。第 2 步获取语言代码语言代码可从 Weblate 页面 URL 末尾获取。Dockge 采用 IETF 语言标签风格例如简体中文 →zh-CN见 frontend/src/lang/zh-CN.json繁体中文 →zh-TW葡萄牙语巴西→pt-BR德语瑞士→de-CH第 3 步在languageList末尾追加语言打开 frontend/src/i18n.ts在languageList对象末尾按如下格式追加一行const languageList { ... zh-TW: 繁體中文 (台灣), 你的语言代码: 语言自称, };键key第二步获取的语言代码必须与frontend/src/lang/下 JSON 文件的文件名完全一致如zh-TW对应zh-TW.json否则 mixins/lang.ts 的动态加载langModules[../lang/ lang .json]会找不到文件值value该语言的「自称」用该语言书写的语言名会直接显示在下拉菜单中。从当前 i18n.ts 可以看到languageList已收录 30 余种语言涵盖bg-BG、es、de、fr、pl-PL、pt-BR、zh-CN、zh-TW、ur、ko-KR、ru、ar、th、ja、vi等新增语言时应追加在对象末尾以保持可读性。第 4 步提交分支并创建 Pull Request将修改提交到新分支并为维护者创建 Pull Request 等待审核合并。建议同时补齐两点在 frontend/src/lang/ 目录下新建与语言代码同名的 JSON 文件至少包含languageName键与常用界面词条可直接复制en.json作为模板逐步翻译检查新语言的文字方向见下文 RTL 说明。语言切换背后的源码机制理解运行时机制有助于在新增语言时避开常见坑点。初始语言的选择与回退i18n.ts 中的currentLocale按优先级决定启动语言用户此前在设置中保存的localStorage.locale浏览器navigator.language完整匹配languageList浏览器语言的前两位代码匹配languageList兜底为en英语。同时createI18n配置了fallbackLocale: en与silentFallbackWarn、silentTranslationWarni18n.ts。这意味着即使你的语言文件翻译不完整缺失的词条也会静默回退为英文显示而不会报错——因此新增语言时可以分阶段提交翻译不必一次性补齐全部词条。动态切换与持久化mixins/lang.ts 是语言切换的枢纽其changeLang方法完成四件事async changeLang(lang: string) { const message (await langModules[../lang/ lang .json]()).default; this.$i18n.setLocaleMessage(lang, message); this.$i18n.locale lang; localStorage.locale lang; setPageLocale(); }动态 import 对应语言 JSON 并注册到 vue-i18n切换当前 locale将选择写入localStorage.locale持久化调用setPageLocale()同步页面级属性。该 mixin 被挂载到全局组件树设置页 Appearance.vue 的语言下拉框通过v-model$root.language双向绑定触发watch.language从而即时完成切换。页面语言属性与 RTL 方向util-frontend.ts 中的setPageLocale会把lang属性写入html元素并依据localeDirection()设置dir属性。RTL从右到左语言列表定义在 i18n.tsconst rtlLangs [ fa, ar-SY, ur, ar ];当前仓库中已含ar阿拉伯语与ur乌尔都语两个 RTL 语言的翻译文件。如果你新增的语言属于 RTL 语系如希伯来语he、波斯语fa务必同时将其加入rtlLangs数组否则界面排版方向会错误。翻译贡献的注意事项结合仓库现状参与翻译时建议留意以下几点以en.json为基准frontend/src/lang/en.json 是词条键的权威来源翻译时保持键名不变、只翻译值维护languageName与下拉菜单的一致性下拉菜单选项来自$i18n.availableLocales即languageList的键语言显示名来自messages[lang].languageName两者缺一不可新增语言需要语言清单 JSON 文件双提交只在languageList加条目而没有对应 JSON 文件时运行时按需加载会失败反之只加 JSON 文件不在清单中下拉菜单不会出现该语言提交渠道普通译者推荐走 Weblate 协作流程涉及源码改动新增语言、RTL 支持则按官方指引提交分支并发起 Pull Request等待维护者审核。按照上述流程从参与既有语言的日常翻译到为 Dockge 接入一种全新语言的完整闭环都可以独立完成且每一步都能在 frontend/src/i18n.ts、frontend/src/mixins/lang.ts、frontend/src/lang/ 等源码文件中找到直接对应实现便于验证与持续迭代。赞分享后端前端容器编排运维【免费下载链接】dockgeA fancy, easy-to-use and reactive self-hosted docker compose.yaml stack-oriented manager项目地址https://gitcode.com/GitHub_Trending/do/dockge点击查看免费下载相关推荐Karakeep国际化Weblate多语言翻译的协作流程Karakeep国际化Weblate多语言翻译的协作流程 Karakeep是一款强大的自托管书签管理应用支持链接、笔记和图片的全方位收藏并具备AI自动标签后端前端移动开发AI 应用知识管理全文检索MCP 服务Woodpecker 前端国际化指南基于 Vue I18n 与 Weblate 的多语言翻译机制Woodpecker 前端国际化指南基于 Vue I18n 与 Weblate 的多语言翻译机制 Woodpecker 的 Web 界面通过社区驱动的翻译平台CI/CDDevOpsCopyQ 多语言国际化翻译实践指南从 Weblate 协作到 Qt 工具链CopyQ 多语言国际化翻译实践指南从 Weblate 协作到 Qt 工具链 CopyQ 是一款功能丰富的剪贴板管理器其桌面界面由 Qt 构建面向全球用户桌面应用上一篇Cat-Catch资源嗅探扩展10分钟搞定网页隐藏媒体捕获下一篇BootstrapVue 星级评分组件 b-form-rating 完全指南交互、只读展示、样式定制与无障碍支持创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考