react-i18next сбивается при перезагрузке страницы

Question

При перезагрузке страницы сбивается перевод
И вместо, например, 'settings' в компонент выводится "TRANSLATION.COMPONENTS.SIDEBAR.SETTINGS"

Причём, перевод сбивается если перезагрузка страницы происходит не от корня приложения

Например:
http://localhost:8080/account (всё ок)
http://localhost:8080/account/some-user-id/items (сбивается)

Если переходить "вручную", через ссылки в react-router-dom, тогда всё ок
А если перезагрузить страницу, то перевод ломается

В компонентах использую хук useTranslation

Как это фиксится?

Answer 1

Проблема была в пути при инициализации i18n
Перевод перестал сбиваться при перезагрузке когда добавил слэш в backend.loadPath
Было:
loadPath: 'public/locales/{{lng}}/translation.json'

Стало:
loadPath: '/public/locales/{{lng}}/translation.json'

i18n
  .use(Backend)
  .use(LanguageDetector)
  .use(initReactI18next)
  .init({
    supportedLngs: languages,
    fallbackLng: 'en',
    debug: false,
    react: {
      useSuspense: false,
    },
    backend: {
      loadPath: '/public/locales/{{lng}}/translation.json',
    },
    detection: {
      order: ['cookie', 'localStorage'],
      caches: ['cookie'],
    },
  })

БЛОГ НА HUSL

react-i18next сбивается при перезагрузке страницы

Ответы (1 шт):