question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Module Federation with Library Type Module (ESM) is not working

See original GitHub issue

Bug report

What is the current behavior? When setting

    new ModuleFederationPlugin({
      name: "app1",
      filename: "remoteEntry.js",
      library: {
        type: "module"
      },
      remotes: {
        app2: "http://127.0.0.1:3002/remoteEntry.js",
      },
      exposes: {
        "./Button": "./src/Button",
      }
    })

in module federation plugin config, the generate remote entry is not exporting anything. Or simply saying, consuming remote is not working.

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

(https://github.com/saravanan10393/mf-es-module)[Here is the reproduce repo] also (https://gist.github.com/saravanan10393/8185ef0a3e56f9419bbc5a299815aad4)[here is the generated removeEntry of app1.]

What is the expected behavior? The remoteEntry with ESM target support is needed.

Other relevant information: webpack version: 5.51.1 Node.js version: 14 Operating System: Mac Additional tools:

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:14 (5 by maintainers)

github_iconTop GitHub Comments

3reactions
rakshans1commented, Nov 8, 2021

@ckken Try setting library.type to window

    new ModuleFederationPlugin({
      name: 'app',
      filename: 'remoteEntry.js',
      remotes: {},
      exposes: {
        './App': './app.js',
      },
      shared: sharedDependencies,
      library: {
        type: 'window',
        name: 'app',
      },
    }),
2reactions
erickbelfycommented, Nov 26, 2021

Is there a place or documentation where I can see all the library types? I’m passing through the same problem above, with same configuration, but I can’t find a place where there’s a detailed explanation of library types.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Module Federation - webpack
Remote modules are modules that are not part of the current build but are loaded at runtime from a remote container. Loading remote...
Read more >
Webpack module federation is not working with eager shared ...
I used dynamic load technique for my remote library and it seems shared modules are not being fetched again and again now.
Read more >
Module Federation Series Part 1: A Little in-depth
Module federation solves those issues by sharing common dependencies and it works with multiple versions or types of framework/library. .
Read more >
Pitfalls with Module Federation and Angular
In this article, I'm going to destroy my Module Federation example! However, you don't need to worry: It's for a very good reason....
Read more >
Introduction to Micro Frontends with Module Federation, React ...
Thanks to the Webpack module federation, we can deal with those apps ... And to avoid type issues with remotes - federated parts...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found