originjs / vite-plugin-federation

Module Federation for vite & rollup
Other
2.39k stars 241 forks source link

Issue with i18next #622

Open lukasz-ciskowski opened 3 months ago

lukasz-ciskowski commented 3 months ago

Versions

Reproduction

Hey, I have found a very interesting bug while working with this package and i18next. The code to reproduce can be found here under this github repository https://github.com/lukasz-ciskowski/i18next-issue

I've linked the github repo because this bug only happens for the built version of the package, when i18next is added to shared modules using this code

federation({
    name: "app",
    remotes: {},
    shared: ["i18next"],
}),

While opening the production version of the application (dev version works great), the app does not load and in the console I can see the following error

image

it appears that it happens when I am using specific I18n functions such as

i18next.on("languageChanged", () => {})

removing the following code fixes the issue, other I18next functionalities work as expected

Steps to reproduce

Go to repository https://github.com/lukasz-ciskowski/i18next-issue, download it on your machine, install the dependencies and run the build using npm run build then open the generated code - the application will not open and in the console you will see the error

What is Expected?

The shared i18next instance should work

What is actually happening?

I tried to find out the potential issue that this could happen and I found this:

When I logged out the I18next object using simple

console.log(I18next)

for the development mode I am getting this

image

but for the production code its this:

image

it seems like the shared package somehow breaks the object instance

and that would make things clear why the presented code with event listener does not work: the events are handled in a class EventEmitter https://github.com/i18next/i18next/blob/master/src/EventEmitter.js where the original i18next class is extending this class https://github.com/i18next/i18next/blob/master/src/i18next.js

mrvan2851 commented 3 months ago

host side : i18n.use(initReactI18next).init(options ) remote side: use i18next like i18n.addResourceBundle('en', 'YourNameSpace', en ) i work for me with single instance i18n for host and all remote.