如何使用 i18next 更好地组织多个命名空间

Question

我有多个命名空间和多个不同的语言文件，但我们可能有更多，而且会非常大，我想知道是否有更简单或组织更好的方式。目前，我从每种语言导入每个名称空间，所以我这样导入它们：

// auth
import auth_de from './de/auth.json';
import auth_en from './en/auth.json';
import auth_es from './es/auth.json';
import auth_fr from './fr/auth.json';
import auth_it from './it/auth.json';
import auth_pt from './pt/auth.json';
import auth_zh from './zh/auth.json';
// global
import global_de from './de/global.json';
import global_en from './en/global.json';
import global_es from './es/global.json';
import global_fr from './fr/global.json';
import global_it from './it/global.json';
import global_pt from './pt/global.json';
import global_zh from './zh/global.json';

然后我为每种语言创建资源文件：

const resources = {
  de: {
    auth: auth_de,
    global: global_de,
  },
  en: {
    auth: auth_en,
    global: global_en,
  },
  es: {
    auth: auth_es,
    global: global_es,
  },
  fr: {
    auth: auth_fr,
    global: global_fr,
  },
  it: {
    auth: auth_it,
    global: global_it,
  },
  pt: {
    auth: auth_pt,
    global: global_pt,
  },
  zh: {
    auth: auth_zh,
    global: global_zh,
  },
};

在这个例子中，我有 7 种语言和 2 个命名空间，但我们将来可能会有更多的语言，但我们肯定会有更多的命名空间，我猜大约有 15 个，所以这个文件会非常大大，有没有更好的组织方式？

Answer 1

就我个人而言，我会 lazy load the translations with a backend plugin like i18next-http-backend (or i18next-locize-backend)?

有一个很好的 React 指南，展示了如何将翻译与代码分开并延迟加载它们，here. And the usage on how to use multiple namespaces 使用 react-i18next。

如何使用 i18next 更好地组织多个命名空间

How to better organize multiple namespaces using i18next

javascript

node.js

es6-modules