i18next
5 分钟内自动翻译你的 i18next 项目
概览
本教程将演示在使用 i18next 时,如何自动化管理项目的翻译文件。
我们将按照以下 4 个步骤进行:
提示:
通过使用 <T> 组件,可避免直接处理翻译文件的繁琐工作。
步骤 1:添加环境变量
将生产环境的 API key 和项目 ID 添加到环境变量中。
这是使用 gtx-cli 工具所必需的。
你可以在 General Translation 控制台 获取这些信息。
GT_API_KEY=<your-api-key>
GT_PROJECT_ID=<your-project-id>步骤 2:安装 gtx-cli
在项目中安装 gtx-cli 工具。
npm i gtx-cliyarn add --dev gtx-clibun add --dev gtx-clipnpm add --save-dev gtx-cli步骤 3:创建 gt.config.json 文件
在项目根目录创建一个 gt.config.json 文件。
{
  "defaultLocale": "en",
  "locales": ["zh", "es", "ja"],
  "files": {
    "json": {
      "include": ["messages/[locale]/*.json"]
    },
  },
}可按需自定义 gt.config.json 文件。更多信息请参阅配置文档。
调整 json 文件格式,使 include 路径与项目结构一致。
翻译将保留原始字符串的语法。
步骤 4:将 gtx-cli translate 命令添加到构建流程
在执行构建命令之前,将 gtx-cli translate 命令加入到构建或 CI 流程中,以自动把翻译文件添加到项目中。
{
  "scripts": {
    "translate": "npx gtx-cli translate",
    "build": "npm run translate && <你的构建命令>"
  }
}这将为你的所有 locales 生成翻译,并将其保存到项目中。 如果你想把这些 files 提交到代码仓库,可以在提交前先运行此命令。
完成!现在,每当项目有变更时,所有翻译 JSON 文件都会自动更新。
注意事项
- 你可以使用 gtx-cli translate命令为项目自动添加翻译。
- 如果你打算将翻译文件提交到版本库,请在提交前运行 gtx-cli translate命令。
- 如需配置翻译的输出路径,请参阅配置文档。
后续步骤
- 查看该 CLI 工具的使用指南。
这份指南怎么样?

