[Module Federation] collision between modules of differents remotes.

[penguintree]

Bug report

What is the current behavior?
A host consumes two different remotes.
Both remotes have the same file structure, i.e. both exposes ./src/main.js under different names.

remote package 1 :

const moduleFederation = new ModuleFederationPlugin({
   name: 'somePackage',
   filename: 'somePackage.entrypoint.js',
   exposes: {
      './x': './src/main'
   }
});

remote package 2 :

const moduleFederation = new ModuleFederationPlugin({
   name: 'anotherPackage',
   filename: 'anotherPackage.entrypoint.js',
   exposes: {
      './y': './src/main'
   }
});

host :

const moduleFederation = new ModuleFederationPlugin({
   name: 'host',
   filename: 'host.entrypoint.js',
   remotes: {
      'firstRemote': 'somePackage@http://localhost:9001/somePackage.entrypoint.js',
      'secondRemote': 'anotherPackage@http://localhost:9002/anotherPackage.entrypoint.js'
   }
});

In the host app, when using both federated modules, the first one overrides the second.

import firstPackage from 'firstRemote/x';
import secondPackage from 'secondRemote/y'; // here object from firstRemote/x is imported, but it's not the same instance.

If the current behavior is a bug, please provide the steps to reproduce.
This repository reproduces the bug.

What is the expected behavior?
Both modules from both remotes should be loaded independently, as the similarities in the exposed file name is merely a coincidence and is not known by the host.

Other relevant information:
webpack version: 5.50.0
Node.js version: 14.17.0
Operating System: Windows 10 20H2 19042.1110
Additional tools: n/a

[webpack-bot]

For maintainers only:

• webpack-4
• webpack-5
• bug
• critical-bug
• enhancement
• documentation
• performance
• dependencies
• question

[alexander-akait]

Please update webpack to the latest version

[penguintree]

Please update webpack to the latest version

It's already 5.50.0. I missed a « 0 » in my post, corrected.

[penguintree]

@alexander-akait I don't understand why it is labelled as "question". I really think it is a bug. Can you explain ? Maybe it is part of the process.

[alexander-akait]

Because we have a lot of tests for module federation and most likely there is no bug here, only but no one has looked yet, it is in my todo

[alexander-akait]

TypeError: secondRemote_y__WEBPACK_IMPORTED_MODULE_1___default(...).doSomethingWithPackage2 is not a function

Are you sure reproducible test repo works fine?

[alexander-akait]

It was answered a lot of time:

https://github.com/penguintree/webpack-module-federation-module-cache-issue/blob/main/remote-package-1/package.json#L2
https://github.com/penguintree/webpack-module-federation-module-cache-issue/blob/main/remote-package-2/package.json#L2

Webpack generates runtime based on uniqueName (webpack generates shared function, look at source code, webpackChunktoolpackage_v1), you have the same uniqueName for different packages, so you share code between remotes, it creates collisions, here logic for default value https://github.com/webpack/webpack/blob/main/lib/config/defaults.js#L616, so you should have different names

[alexander-akait]

@chenxsan @snitin315 Let's add this problem to https://webpack.js.org/concepts/module-federation/#troubleshooting

[penguintree]

TypeError: secondRemote_y__WEBPACK_IMPORTED_MODULE_1___default(...).doSomethingWithPackage2 is not a function

Are you sure reproducible test repo works fine?

Yes the error is the symptom. The function doSometingWithPackage2 do exists in remote-pacakge-2 and should be available.

[alexander-akait]

Change name in package.json for remote-package-1 and remote-package-2 and all will be work fine

[penguintree]

Thanks a lot.
I would have thought that the name provided in ModuleFederationPlugin would be sufficient to make to completely independant packages. It looks like both must be unique, the name in the plugin and in package.json.