I'm using the i18next library in version "i18next": "^21.8.0" ,to localize my React app.

When I tried to reload an await resource, I saw many examples, but no one was able to show me how to load a json file async.

When I try to add the resource through console.log(await langRequest), I get the correct input.

There is the function that returns the JSON file correctly for me:

const langRequest = async () => {
    const url = createUrl('Ajax/GetStrings', { lang: 'he' });
    const languageResponse = await get(url);
    return languageResponse;
}

And there is the init method:

i18n.use(initReactI18next).init({
    resources: {
        he: { translation: await langRequest }
    },
    fallbackLng: 'en',
    debug: true,
    react: {
        useSuspense: false
    }
})

I tried to write this code witout await before the langRequest but it still not working.

• The init is outside of component brackets.

• I tried using an empty resource and i18next.addResourceBundle(language, {languageResponse}); in useEffect, but got the following error:

bundle.js:149045 Uncaught (in promise) TypeError: key.indexOf is not a function at cleanKey (bundle.js:149045:23) at getLastOfPath (bundle.js:149069:8) at getPath (bundle.js:149092:25) at ResourceStore.addResourceBundle (bundle.js:149411:18) at I18n._this2. [as addResourceBundle] (bundle.js:151544:50) at bundle.js:868:53

Thanks a lot to all helpers!