'i18next-http-backend' module couldn't be load-CodePudding

Using the following code construct the module 'i18next-http-backend' (installed version: "i18next-http-backend": "^1.4.1") cannot be load, in the browser console I find the following error: "Uncaught Error: You are passing an undefined module! Please check the object you are passing to i18next.use()".

import * as i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
import i18nLanguageDetector from 'i18next-browser-languagedetector';
import i18nBackend from 'i18next-http-backend';

i18n.use(i18nLanguageDetector) // detect user language
    .use(i18nBackend) // load translation using http
    .use(initReactI18next) // pass the i18n instance to react-i18next
    .init({
        detection: {
            // order and from where user language should be detected
            order: ['querystring', 'navigator', 'htmlTag'],
            // keys or params to lookup language from
            lookupQuerystring: 'language',
            // htmlTag with lang attribute
            htmlTag: document.documentElement
        },
        backend: {},
        fallbackLng: 'en',
        debug: true
    });

export default i18n;

I use a self-constructed configuration with React.js and webpack, among others. It's my first React.js / webpack project so the bug could be anywhere.

What am I doing wrong? Module import, webpack bundling, ...?

CodePudding user response：

I solved my problem, in tsconfig.json I had to set "module" to "es2020" (old, for me incorrect value "commonjs")

CodePudding user response：

You should install i18n backend library:

try run:

npm i i18n-backend

check: https://www.npmjs.com/package/i18n-backend