vue.js + i18n 的推荐工作流程是什么？

Question

我最近从使用 Django 框架开发到 vue.js。我很难理解的一件事是添加翻译的工作流程。

在 Django 中，我的工作流程感觉非常直观：

1. 使用翻译挂钩注释我的代码。
2. 将翻译挂钩提取到 .po (gettext) 文件中
3. 将消息翻译成所需的语言环境，即在 .po 文件中工作
4. 编译 .po 文件

在我所有的工作都需要翻译的情况下，这个工作流程非常方便且万无一失。

我对迁移到 vue.js 感到很兴奋，但我担心翻译工作流程的差异可能会破坏交易。或者，我缺少什么？以下是我对 vue.js/i18n 工作流程的理解

1. 使用翻译挂钩注释我的代码。与 Django 流程不同，我使用翻译 ID 来链接消息和翻译。
2. 手动将这些翻译 ID 添加到 JSON 文件中，例如en.json
3. 将该 json 文件镜像到不同语言环境的文件，例如，fr.json

我知道我可以使用BabelEdit 之类的工具来管理最后一步。虽然这似乎是一个很棒的工具，但这是我真的很难理解的第二步。如果没有像 django-admin/gettext makemessages 这样的功能，这似乎是一项乏味且低效的任务。

我在这里做错了什么？我想我不是唯一一个有这些需求的人，那么哪些翻译工作流适用于其他使用 vue.js 开发的人？

提前致谢。

Answer 1

我相信您可以在第 2 步中使用 https://github.com/pixari/vue-i18n-extract。我认为 BabelEdit 只有在您将翻译保留为 Vue 组件中的 <i18n> 部分时才能提供帮助（在这种情况下，您将需要 https://github.com/intlify/vue-i18n-loader）