i18next 未从 public 文件夹中加载文件

Question

我正在尝试加载多个翻译文件来响应应用程序。到目前为止，我已经能够分离文件尝试附加两个不同翻译文件的名称时遇到问题 -- /locales/{{lng}}/{{ns}}.json?lng=en+es&ns=translation1+translation2)

我已经解决了这个问题，但现在它无法从 public 文件夹中读取

我的配置文件如下所示

import i18n from 'i18next'
import Backend from 'i18next-http-backend'
import Http from 'i18next-http-backend'
import { initReactI18next } from 'react-i18next'
import BackendAdapter from 'i18next-multiload-backend-adapter'

const languages = ['en', 'es']

i18n
  .use(Backend)
  .use(initReactI18next)
  .init({
    defaultNS: 'menus',
    fallbackLng: 'en',
    debug: true,
    whitelist: languages,
    lng: 'en',

    backend: {
      backends:[
        new BackEndAdapter(null, {
          backend: new Http(null,{
            loadPath: `${process.env.PUBLIC_URL}/locales/{{lng}}/{{ns}}.json?lng={{lng}}&{{ns}}`,
            addPath: `${process.env.PUBLIC_URL}/locales/add/{{lng}}/{{ns}}`,
            allowMultiLoading: true
          })
        })
      ]    
    },

    interpolation: {
      escapeValue: false
    }
  })

export default i18n

package.json

{
   "i18next": "^19.5.1",
   "i18next-http-backend": "^1.0.15",
   "i18next-multiload-backend-adapter": "^1.0.0"
}

使用 this 作为需要多负载适配器的参考

Answer 1

它应该是这样的：

import i18n from 'i18next';
import HttpBackend from 'i18next-http-backend';
import { initReactI18next } from 'react-i18next';

const languages = ['en', 'es'];

i18n
  .use(HttpBackend)
  .use(initReactI18next)
  .init({
    defaultNS: 'menus',
    fallbackLng: 'en',
    debug: true,
    whitelist: languages,
    lng: 'en',

    backend: {
      loadPath: `${process.env.PUBLIC_URL}/locales/{{lng}}/{{ns}}.json?lng={{lng}}&{{ns}}`,
      addPath: `${process.env.PUBLIC_URL}/locales/add/{{lng}}/{{ns}}`,
    },

    interpolation: {
      escapeValue: false,
    },
  });

export default i18n;

i18next 未从 public 文件夹中加载文件

i18next not loading in file from public folder

i18next

reactjs

react-i18next