Uncaught TypeError: Cannot read properties of undefined (reading 'call')

[rmjwilbur]

Bug report

What is the current behavior? Can't have same package.json name on host and remote. Getting error at some point using module federation, guessing when splitChunks kicks in.

If the current behavior is a bug, please provide the steps to reproduce. Set host's and remote's name in package.json to same value. Try to load a remote page large enough to trigger splitting chunks (again guessing).

What is the expected behavior? Should not result in error, or, provides a better error message

Other relevant information:

• Similar experience as @ydmitry in issue 12964 where there is a point that adding a single line of code to a React component's render method results in the error, and removing the line clears the error. Line was a simple MUI <Typography> which already appears multiple times in the component.

• Same as @ydmitry setting splitChunks = false on remote resolved the error

• Ran across another report of the error https://discourse.aurelia.io/t/aurelia-1-and-webpack-module-federation-plugin-different-package-json-names/4398 which suggested the error occurred when the package.json names were different and setting them to the same name resolved the error.

• On checking my package names, found they were the same. Removed splitChunks = false, verified error was present again, changed package names to be different, and error was gone.

I'm fine for now. Hope this helps someone else struggling with this error.

webpack version:
Node.js version: Operating System: Additional tools:

[vankop]

Can't have same package.json name on host and remote.

sounds reasonable, webpack relies on package names..

[danierlr]

I have a similar problem with different names in package.json, when using module federation.

Here is the reproduction: https://github.com/danierlr/WebpackModuleFederationError

Here is the Stack overflow question: https://stackoverflow.com/questions/71738820/webpack-module-federation-error-cannot-read-properties-of-undefined-reading-c

[AlexSapoznikov]

Any updates about this issue? Different name in package.json and no chunk splitting enabled.

[alexander-akait]

@AlexSapoznikov Can you create reproducible test repo?

[jponc]

I'm also getting the same issue. It seems that the host/container is getting confused between installedModules and __webpack_modules__

webpack_modules

webpack/container/reference/marketing

installedModules

webpack/container/remote/marketing/MarketingApp

---

So now when the code reaches __webpack_modules__[moduleId] it returns undefined because moduleId is webpack/container/remote/marketing/MarketingApp coming from installedModules

---

My host configuration looks

My App.tsx looks:

Which returns an error

[vankop]

please try to create reproducible repo

[rcasca]

I have exactly the same issue. please help.

[afeichuanqi]

I have exactly the same issue. please help.

[afeichuanqi]

我也遇到了同样的问题。似乎主机/容器在 和 之间感到installedModules困惑__webpack_modules__

webpack_modules

webpack/容器/参考/营销

已安装的模块

webpack/容器/远程/营销/MarketingApp

所以现在当代码到达它__webpack_modules__[moduleId]返回 undefined 因为来自moduleId``webpack/container/remote/marketing/MarketingApp``installedModules

我的主机配置看起来

我的 App.tsx 看起来：

返回错误

I don't know if TS caused this problem

[alexander-akait]

WHen you have this error, it means you don't have valid export, webpack can't validate aleady bundled runtime on compilation step, so you have an error in runtime, nothing to fix in webpack, check your exports in module federation

[jponc]

Just to give some context -- I'm currently developing a proof of concept related to microfrontends utilising webpack module federation. I'm also using NX (https://nx.dev/) to handle the different microfrontends. NX has this notion of only having a single package.json (root) instead of having a package.json per individual microfrontend/app.

Solution

Now, webpack assumes that you have defined a "unique" name inside your package.json file per microfrontend in order for it to work. Since I'm using NX, the solution I encountered is to modify the uniqueName attribute in webpack config so it doesn't rely on the name attribute from package.json.

Source: https://webpack.js.org/configuration/

After I've added uniqueName per webpack config (one for each microfrontend/app) then it worked as expected and this error went away.

[daguiheso]

Excelent @jponc , I dont use NX, but effectively my diferent packages.json did not have the name property set. Adding it to all packages.json fixed it. Thanks

[jponc]

Excelent @jponc , I dont use NX, but effectively my diferent packages.json did not have the name property set. Adding it to all packages.json fixed it. Thanks

@daguiheso Glad the solution worked for you mate! 🚀

[BarrMan]

Hey all, I have the same error but none of the above helped.

Looking closely at the error message I can see that the moduleId that webpack tries to find is: webpack/container/remote/myRemoteMFE/Module, but when trying to retrieve the factory, it tries to look inside of __webpack_modules__ which contains: webpack/container/reference/myRemoteMFE.

Maybe it was registered under the wrong name?

[jpmadrigal07]

Hey all this seems to work for me.

https://stackoverflow.com/a/72746448

The problem is about asynchronous load of the app

[ter9ng]

Was having this issue and tried the fixes above. Nothing worked. My issue was that I had multiple project named "ClientApp" and they all had the same project name in the angular.json file. Changing the name of the project in the angular.json file to unique one solved it for me.

("@angular-architects/module-federation": "^14.3.10")

[JiahuiChen99]

Hey all, I have the same error but none of the above helped.

Looking closely at the error message I can see that the moduleId that webpack tries to find is: webpack/container/remote/myRemoteMFE/Module, but when trying to retrieve the factory, it tries to look inside of __webpack_modules__ which contains: webpack/container/reference/myRemoteMFE.

Maybe it was registered under the wrong name?

I got the same error as @BarrMan, tried everything aforementioned, but nothing solved the issue. Does anyone know how to fix this??

[UNDERCOVERj]

reproducible

I meet the same error with you

webpack_module has 'webpack/container/reference/remoteApp'

but moduleId is 'webpack/container/remote/remoteApp'

I think the code is not excuted in ContainerReferencePlugin。because RemoteRuntimeModule generate code has onFactory。

[UNDERCOVERj]

I have exactly the same issue. please help.

[ruokaka]

I have the same issue as well.

[LucianViana]

I have the same issue as well.

[wangzhanpeng]

i have the same issue. update the name of package.json ,it done, i fix the issue.

[JiahuiChen99]

i have the same issue. update the name of package.json ,it done, i fix the issue.

Hey @wangzhanpeng, I guess you got it working, right? How did you change the package.json name to solve it?

[ASVVlasov]

I have the same issue as well.

[webpack-bot]

This issue had no activity for at least three months.

It's subject to automatic issue closing if there is no activity in the next 15 days.

[webpack-bot]

Issue was closed because of inactivity.

If you think this is still a valid issue, please file a new issue with additional information.

[Pradeep976]

I have the same issue as well

[gitnupur]

Getting the same error in react.js typescript microfrontend. I have added shared deps , unique name. The app loads sometimes

react.development.js:1407 Uncaught TypeError: Cannot read properties of undefined (reading 'call') at options.factory (react refresh:6:1) at webpack_require (bootstrap:24:1) at fn (hot module replacement:62:1) at ../node_modules/react-mui-checkbox/dist/react-mui-checkbox.esm.js (vendors-node_modules_dls_react-mui-checkbox_dist_react-mui-checkbox_esm_js-node_modules_dls_r-95a0d5.js:16:75) at options.factory (react refresh:6:1) at webpack_require (bootstrap:24:1) at fn (hot module replacement:62:1)

The microfronts intermittently gives the above error. Any help

[Pradeep976]

@gitnupur Have you try added lazy loading and have you bootstrapped your app / Used Suspense and Error Boundaries ?

[alexander-akait]

Please, if you need help, provide reproducible test repo, thank you