Как использовать i18next со страницами github

Я разработал приложение для реагирования с интернационализацией, используя библиотеку react-i18next. У меня для этого есть обычная конфигурация (как в readme библиотеки):

import i18n from 'i18next';
import LanguageDetector from 'i18next-browser-languagedetector';
import Backend from 'i18next-xhr-backend';
import { initReactI18next } from 'react-i18next';

i18n
  .use(Backend)
  .use(LanguageDetector)
  .use(initReactI18next)
  .init({
    fallbackLng: "en",
    interpolation: {
      escapeValue: false
    }
  });

  export default i18n;

И мои файлы переводов помещаются в public/locales/de/translation.json (и кроме de папок), как и в docs.

Работает в режиме разработки. Я развернул приложение на heroku, там оно тоже отлично работает. Но мне нужно, чтобы он работал на сайте страниц github, и мои jsons (файлы translation.json) не загружаются туда, и я получаю эти ошибки (из консоли браузера):

Failed to load http://hereIsMyUsername.github.io/locales/en/translation.json resource: the server responded with a status of 404 ()

После создания приложения React у меня есть следующая структура моей папки build:

build
- locales
- static
  - css
  - js
  - media

Итак, в целом мое приложение отлично работает на страницах github, за исключением того, что оно не может загружать jsons. Я читал в документах, что это потому, что страницы github пытаются загрузить эти jsons из корневого каталога и не могут найти их там, потому что они хранятся в locales / {lang} /translation.json. Поэтому рекомендуемый способ - поместить все файлы json и другие файлы в root. Но поскольку у меня много разных файлов translation.json, я не могу ими управлять.

Итак, мой вопрос в том, как заставить страницы github работать с ним? Или как настроить мой i18n для работы со страницами github?


person E. Dn    schedule 11.01.2020    source источник


Ответы (1)


Для gh-страниц вам необходимо адаптировать loadPath в опциях backend: https://github.com/i18next/i18next-xhr-backend/blob/master/README.md#backend-options

Поскольку ваши gh-страницы обслуживаются по дополнительному пути (обычно это имя репо)

person adrai    schedule 11.01.2020