javascript - react-i18next、小道具からリソースを追加

Question

コンポーネントを含むレポとメインアプリを含むレポがあります。コンポーネントを使用してリポジトリに i18next を実装しましたが、このリポジトリに i18n 構成ファイルがある場合 (またはアプリ リポジトリから props で渡す場合) に正常に動作します。しかし、メインアプリから「リソース」部分のみを送信し、コンポーネントの構成ファイルでそれを置き換えようとすると問題が発生します。i18n インスタンスのクローンを作成してリソースを設定しようとしましたが、うまくいきません。それは私の設定ファイルです: i18n.js

import i18n from 'i18next';
import LngDetector from 'i18next-browser-languagedetector';
import { reactI18nextModule } from 'react-i18next';

i18n
  .use(LngDetector)
  .use(reactI18nextModule)
  .init({
    detection: {
      order: ['cookie', 'localStorage'],
      lookupLocalStorage: 'i18n_lang',
      lookupCookie: 'i18n_lang',
      caches: ['localStorage'],
    },
    load: 'current',
    fallbackLng: 'en',

    ns: ['components'],
    defaultNS: 'components',

    keySeparator: false,
    interpolation: {
      escapeValue: false,
      formatSeparator: ',',
        },
        react: {
          wait: true,
     },
  });

export default i18n;

resources.js ファイル (最初に resources キーを使用してみましたが、まだ機能しません):

import * as en from './en.json';
import * as de from './de.json';

export default {
  en: {
    components: en,
  },
  de: {
    components: de,
  },
};

今、私はこのようなことを試しました:

import * as langs from './resources';

const newI18 = i18n.cloneInstance({ resources: langs });

const i18ProviderDecorator = (storyFn) => (
  <I18nextProvider i18n={newI18}>
    { storyFn() }
  </I18nextProvider>

リソースを使用して小道具で i18n.js を渡すと、完全に機能しますが、メインアプリから i18next を削除して、コンポーネントだけに残したいです。ご挨拶