i18next / i18next-chained-backend

An i18next backend to chain multiple backends (add fallbacks, caches, ...)
MIT License
66 stars 10 forks source link

Missed `backends` in this.options within `init` #1

Closed newsiberian closed 6 years ago

newsiberian commented 6 years ago

Hi, I'm receiving the following: i19next

It happens here: i18next The config is the same as in the example: LocalStorageBackend, XHR

jamuhl commented 6 years ago

Can you paste your i18next init call?

backends should be defined when initializing correctly, like eg. in the localstorage-backend: https://github.com/i18next/i18next-localstorage-backend#getting-started

i18next
  .use(Backend)
  .init({
     backend: {
       // array of existing i18next backends from https://www.i18next.com/plugins-and-utils.html#backends
       backends: [],

       // array of options in order of backends above
       backendOptions: []
}
});
newsiberian commented 6 years ago

here:

i18n
  .use(Backend)
  // .use(XHR)
  .use(reactI18nextModule)
  .init({
    ...i18nOptions,

    // backend: {
    //   loadPath: '/locales/{{lng}}/{{ns}}',
    //   ajax: loadLocales,
    // },
    backend: {
      backends: [
        // primary
        LocalStorageBackend,
        // fallback
        XHR,
      ],
      backendOptions: [{
      // options: [{
        // prefix for stored languages
        prefix: 'i18next_res_',

        // expiration
        expirationTime: 7 * 24 * 60 * 60 * 1000,

        // language versions
        // load from config
        versions: { en: 'v0.1', ru: 'v0.1' },
      }, {
        // xhr load path for my own fallback
        loadPath: '/locales/{{lng}}/{{ns}}',
        ajax: loadLocales,
      }],
    },
  });

and i18nOptions are:

export default {
  // Hardcoded Google Cloud Translation API supported languages
  // this is an output of `languages` query, so it could be updated easily
  // fetched in may 2017
  whitelist: [
    'af',
    'sq',
   ...a long list here
  ],
  fallbackLng: 'ru',

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

  debug:
    process.env.BUILD_FLAG_IS_CLIENT === 'true' &&
    process.env.BUILD_FLAG_IS_DEV === 'true',

  interpolation: {
    // not needed for react!!
    escapeValue: false,
    // format: (value, format) => {
    //   if (format === 'bold') {
    //     // return <b>value</b>;
    //     return value.bold();
    //   }
    //
    //   return value;
    // }
  },

  react: {
    // With this some components are blinking
    // set to true if you like to wait for loaded in every translated hoc
    wait: false,
    // set it to fallback to let passed namespaces to translated hoc act as fallbacks
    nsMode: 'default',
  },
};
jamuhl commented 6 years ago

my fault, update: i18next-chained-backend@0.1.1 i18next-localstorage-backend@1.1.4

newsiberian commented 6 years ago

Cool, thanks, now works as expected even better.

Btw, do you know that turning on react.wait option leads to components blinking on initial frontend part rendering if ssr used?

jamuhl commented 6 years ago

should not be the case if passing down the initialI18nStore like in the samples: https://github.com/i18next/react-i18next/blob/master/example/razzle-ssr/src/server.js#L47

same for next.js: https://github.com/zeit/next.js/blob/canary/examples/with-react-i18next

that gets loaded and wait gets overridden: https://github.com/i18next/react-i18next/blob/master/src/I18n.js#L18