خطأ not exported from 'react-i18next' في React؟

مرحبًا

أحاول إستخدام حزمة react-i18next لإضافة أكثر من لغة في تطبيق React لكني أحصل على الخطأ التالي:

Attempted import error: 'initReactI18next' is not exported from 'react-i18next'

قمت بإنشاء ملف i18n.js وهنا ما يحتويه من كود:

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

i18n.use(Backend)
  .use(initReactI18next)
  .init({
    // الكود التالي من وثائق الخزمة نقسها
    // https://react.i18next.com/getting-started
    fallbackLng: 'en',
    debug: true,	// لإظهار الأخطاء في console

    interpolation: {
      escapeValue: false,
    }
  });


export default i18n;

وهنا محتويات ملف package.json كامل:

{
   "name": "ٌreact",
   "version": "0.1.0",
   "scripts": {
      "start": "react-scripts start",
      "build": "react-scripts build",
      "test": "react-scripts test",
      "eject": "react-scripts eject"
   },
   "dependencies": {
      "axios": "^0.21.1",
      "i18next": "^19.9.2",
      "i18next-browser-languagedetector": "^6.0.1",
      "i18next-http-backend": "^1.1.1",
      "i18next-xhr-backend": "^3.2.2",
      "prop-types": "^15.7.2",
      "proptypes": "^1.1.0",
      "react": "^17.0.1",
      "react-alice-carousel": "^1.17.2",
      "react-dom": "^17.0.1",
      "react-i18next": "^11.8.10",
      "react-loader-spinner": "^4.0.0",
      "react-native-gesture-handler": "^1.5.2",
      "react-navigation": "^4.0.10",
      "react-navigation-stack": "^1.10.3",
      "react-router-dom": "^5.1.2",
      "react-scripts": "^4.0.3"
   },
   "devDependencies": {
      "@babel/plugin-proposal-export-default-from": "^7.8.3",
      "css-loader": "^3.4.2"
   }
}