企业官网建设流程全解析

Hoppscotch 多语言指南：3 条路径配好界面语言，附语言包扩展方法

【免费下载链接】hoppscotchOpen-Source API Development Ecosystem • https://hoppscotch.io • Offline, On-Prem & Cloud • Web, Desktop & CLI • Open-Source Alternative to Postman, Insomnia项目地址: https://gitcode.com/GitHub_Trending/ho/hoppscotch

周五验收多语言接口，前端发现工具界面上某个按钮文案还是英文，当场卡在"这是翻译没做还是我设置没生效"上。Hoppscotch 的多语言支持覆盖了设置、集合、响应查看等几乎全部界面文案，30 多种语言可用。读完这篇，你能自己切语言、改语言包，也能给新语言添砖加脚，不用再猜。

先搞懂：语言包是怎么加载的

Hoppscotch 的界面文案不走 URL 里的语言前缀（旧版 Nuxt 路由写法已废弃），而是集中在packages/hoppscotch-common/locales/目录下，一门语言一个 JSON 文件，比如cn.json对应简体中文。语言注册表 languages.json 负责登记每门语言的 code、文件名和 ISO 代码；界面里出现的下拉选项就是从这里读的。加载逻辑在 src/modules/i18n.ts：选中的语言按需求懒加载，当前选择存进浏览器 localStorage，刷新后自动读回上次的语言；没有存过就按浏览器语言设置匹配，全都对不上就回退英文。像阿拉伯语这类右起语言在注册表里带了dir标记，排版会自动反向。

三条路径，按诉求选最短的

只想用现成的：点右上角头像进设置，在 Language 下拉框里选一门语言，选择会立刻生效并持久化，不用再碰配置文件。

想改几个词：直接编辑对应语言的 JSON（比如packages/hoppscotch-common/locales/cn.json），只动你关心的值；保持 UTF-8 编码、JSON 合法。本地从源码构建的话，改完要重新构建才看得到效果。

想新增一门语言：工作量较大，建议三步走——完整复制en.json作为新文件（别只翻一半，缺键会显示英文）；在languages.json里追加条目，code与文件名保持一致；再提交 PR。流程细节看 TRANSLATIONS.md。

放到真实业务里：多语言验收怎么做

验收一个"按地区返回文案"的接口时，比手动改请求头更省事的做法是把语言参数放进环境：新建环境（比如"中文环境"），加一个键值对accept_language = zh-CN；请求 Headers 里写Accept-Language: {{accept_language}}。切换环境就切换了语言维度，同一批用例能快速复跑en-US、ja-JP等多个版本，响应查看器里的中文、阿拉伯文等字符也能正常显示和检索。

{ "code": "hy", "file": "hy.json", "iso": "hy-AM", "name": "Հայերեն" }

上面是一个语言注册表条目的完整形态，新语言照这个结构追加即可；需要右起排版再加"dir": "rtl"。

给社区出力的最短路径

1. 先翻一下已有的 PR，确认没人正在做这门语言，有就直接加入现有讨论。
2. 从main拉新分支（命名随意，建议带语言代码），在 locales 目录下创建新语言文件。
3. 复制en.json全量结构再逐条翻译，术语全文统一、文案尽量短，别丢占位符。
4. 在languages.json注册新语言，提交 PR；中途翻译没做完也可以先提 PR 求助，合并前要补齐。

踩坑速查

• 切换后部分文案还是英文 → 该语言没翻到对应键，机制上会自动回退英文，不是 bug → 找到缺失键补上翻译，或先当已知缺失处理。
• 改完语言文件毫无反应 → JSON 语法错一个逗号，整个文件加载失败，全部回退英文 → 先用 JSON 校验工具过一遍，确认 UTF-8 编码。
• 源码构建下改了文件看不到变化 → 语言文件参与构建产物，不会热更 → 重新构建，或开浏览器无痕窗口排除缓存再验证。
• 分享链接带/{语言代码}/前缀的旧 URL → 新版已废弃路由前缀写法 → 访问时会自动去掉前缀并跳转到同一路径，无需手动处理。

语言包机制本身已经很轻，后续大概率是更多语言补齐，以及桌面端与 Web 端配置同步得更顺。发现问题可以用这三个渠道反馈：GitHub Issues、Discord 社区、support@hoppscotch.io。觉得这篇有用，顺手点个收藏吧。

【免费下载链接】hoppscotchOpen-Source API Development Ecosystem • https://hoppscotch.io • Offline, On-Prem & Cloud • Web, Desktop & CLI • Open-Source Alternative to Postman, Insomnia项目地址: https://gitcode.com/GitHub_Trending/ho/hoppscotch