Блог

Я хочу, чтобы мой i18n загружал файлы перевода с отложенной загрузкой, и из документов это кажется довольно простым — добавить .use(backend) и import backend from "i18next-http-backend" .

Единственная проблема заключается в том, что экземпляр i18n, который я использую в моем предоставленном, уже определен во внутреннем репозитории моей организации как библиотека пользовательского интерфейса (которую я должен использовать), которая предоставляет только один метод для инициализации экземпляра i18n для вас — это не предусмотрено .use(backend) , и теперь я застрял, какчтобы добавить это в код.

Вот код библиотеки —

 ...

export const getDefaultI18nextInstance = (resources) => {
  i18n
    .use(AlphaLanguageDetector)
    .use(initReactI18next)
    .init({
      fallbackLng: 'en',

      // have a common namespace used around the full app
      ns: [
        'translations',
        'common'
      ],
      nsMode: 'fallback',
      defaultNS: 'translations',

      // debug: (process.env.NODE_ENV amp;amp; process.env.NODE_ENV === 'production') ? false : true,
      debug: true,

      interpolation: {
        escapeValue: false, // not needed for react!!
      },

      resources: resources || null,

      react: {
        wait: true
      }
    });
    Object.keys(translations).forEach(lang => {
      Object.keys(translations[lang]).forEach(namespace => {
        i18n.addResourceBundle(lang, namespace, translations[lang][namespace], true, true)
      })
    });
  return i18n;
}

export default {
  getDefaultI18nextInstance,
  translations,
  t
};
...
 

Я попытался использовать что-то подобное <I18nextProvider i18n={i18n.getDefaultI18nextInstance().use(backend)}> в моем index.js файл, но затем я получаю сообщение об ошибке

i18next::backendConnector: Серверная часть не была добавлена через i18next.use. Не будет загружать ресурсы.

К вашему сведению, у меня есть свои локали в projectRoot/locales/{lang}/translation.json .

Вы можете использовать i18n.cloneInstance(options, callback) и передавать свою конфигурацию серверной части как options , она объединит все параметры, которые есть у вашей библиотеки пользовательского интерфейса, с вашими, и вернет новый экземпляр i18next, который сможет извлекаться.

 import HttpApi from 'i18next-http-backend';

const original = getDefaultI18nextInstance({});

export const i18n = original
  .cloneInstance({
    backend: {
      loadPath: '/locales/{{lng}}/{{ns}}.json',
    },
  })
  .use(HttpApi);