i18next+React适配Firefox与Chrome语言区域代码差异问题求助

不推荐直接复制文件夹的原因：

• 维护冗余：本地化内容更新时需同步修改多份文件，极易出错
• 项目冗余：增加不必要的文件体积，违背代码简洁原则

推荐使用i18next内置的语言回退配置，无需额外复制文件，只需修改初始化配置即可解决问题：

具体配置代码 #

修改你的i18n初始化代码，添加supportedLngs和对象形式的fallbackLng，同时配置语言检测器的白名单校验：

i18n
  .use(Backend)
  .use(LanguageDetector)
  .use(initReactI18next)
  .init({
    fallbackLng: {
      // 映射无区域语言码到对应默认区域
      'de': ['de-DE'],
      'en': ['en-US'],
      // 全局默认回退语言
      'default': ['en-US']
    },
    // 明确声明项目支持的语言列表
    supportedLngs: ['de-DE', 'en-US'],
    debug: true,
    interpolation: {
      escapeValue: false,
    },
    react: {
      useSuspense: false,
    },
    // 开启语言检测器的白名单校验，只加载支持的语言资源
    detection: {
      checkWhitelist: true
    }
  });

配置说明 #

1. fallbackLng对象配置：当检测到de这类无区域语言码时，i18next会自动回退加载de-DE的本地化文件
2. supportedLngs：明确项目支持的语言范围，避免尝试加载不存在的语言资源
3. detection.checkWhitelist：开启后，语言检测器只会返回白名单内的语言或其回退选项，彻底杜绝找不到资源的情况

这种方案完全利用i18next的内置能力，无需修改现有文件结构，维护成本极低，是处理这类语言码匹配问题的标准最优解。

内容的提问来源于stack exchange，提问作者Andréw