创建单独的 i18next 而不使用 I18nextProvider

发布于 2025-01-12 08:02:07 字数 423 浏览 0 评论 0原文

我有一个 shell 和一个 microfront 项目，它们都使用 react-i18next 来管理语言，但我希望每个项目控制自己的 i18next 实例。有没有什么方法可以做到这一点，而无需使用 I18nextProvider 将我的微前端包装在 shell 上并提供新实例？

我创建了这个 POC 您可以模拟问题只是启动并打开 shell 并更改语言，您将看到来自 microfront 的键覆盖了 shell 翻译键。

我希望每个项目在 i18next 方面都独立工作。这可能吗？

提前谢谢

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

探春 2025-01-19 08:02:07

回答我自己的问题，以便将来帮助某人

如果这对某人有帮助，我已经设法解决了删除 react-i18next 来自我的 Module Federation microfront 的可共享配置。

这会是下载两次lib的问题吗？
是的，但这是我发现分离react-i18next 实例的唯一方法。如果有人找到不同的方法，请在这里发帖。谢谢

回复收藏 0 原文

紙鸢 2025-01-19 08:02:07

以下解决方案之一可能适合您：

解决方案 1：

您可以使用 createInstance 函数。

i18next.createInstance(options, callback)

解决方案 2：

覆盖 i18next 实例可能会达到您的目的。

// passing in an i18n instance
// use only if you do not like the default instance
// set by i18next.use(initReactI18next) or the I18nextProvider
import i18n from './i18n';
const { t, i18n } = useTranslation('ns1', { i18n });

了解更多此处

解决方案 3：< /strong>

也许，你需要使用 I18nextProvider

import { I18nextProvider } from 'react-i18next';
import i18n from './i18n';
import App from './App';

<I18nextProvider i18n={i18n}>
  <App />
</I18nextProvider>

何时使用 I18nextProvider？

One of the following solutions might work for you:

Solution 1:

You can create additional instances using the createInstance function.

i18next.createInstance(options, callback)

Solution 2:

Overriding the i18next instance might serve your purpose.

// passing in an i18n instance
// use only if you do not like the default instance
// set by i18next.use(initReactI18next) or the I18nextProvider
import i18n from './i18n';
const { t, i18n } = useTranslation('ns1', { i18n });