gt-next & gt-react

自动翻译您的 gt-next 或 gt-react 项目

概述

本教程将向你展示如何在使用 gt-nextgt-react 时,自动管理你的项目翻译文件。

注意: 这只应在你发布生产构建时使用。如果你在开发环境中使用 gt-next 或 gt-react,则不需要运行此命令。

我们将按照以下 4 个步骤进行操作:

添加你的环境变量

使用 npx gtx-cli configure 命令配置你的项目

提示: 使用 <T> 组件 可以避免处理翻译文件的麻烦。


第一步:添加你的环境变量

将你的生产 API 密钥和项目 ID 添加到环境变量中。 这是使用 gtx-cli 工具所必需的。 你可以在 General Translation dashboard 获取这些信息。

.env
GT_API_KEY=<your-api-key>
GT_PROJECT_ID=<your-project-id>

步骤 2:使用 npx gtx-cli configure 命令配置你的项目

运行 gtx-cli configure 命令来配置你的项目。

npx gtx-cli configure

步骤 3:将 gtx-cli translate 命令添加到你的构建流程中

在构建或 CI 流程中,在构建命令之前添加 gtx-cli translate 命令,以便自动为你的项目添加翻译。

package.json
{
  "scripts": {
    "translate": "npx gtx-cli translate",
    "build": "npm run translate && <your build command>"
  }
}

这将为你所有的语言环境生成翻译,并将其保存到你的项目中。 如果你希望将这些文件提交到你的仓库,可以在提交之前运行此命令。

你已经完成了!现在,每当你的项目发生变化时,所有的翻译 JSON 文件都会自动更新。


注意事项

  • 你可以使用 gtx-cli translate 命令自动为你的项目添加翻译。
  • 如果你想提交你的翻译文件,也可以在提交前运行 gtx-cli translate 命令。
  • 要配置翻译输出路径,请参阅 配置 文档。

后续步骤

  • 查看 cli 工具的使用指南
  • 如果你想在开发过程中看到实时翻译(类似热重载),请查看<T> 组件

这份指南怎么样?