webpack icon indicating copy to clipboard operation
webpack copied to clipboard

Single Runtime Chunk breaks Module Federation Container init

Open ScriptedAlchemy opened this issue 1 year ago • 1 comments

https://github.com/webpack/webpack/pull/18811

Bug report

What is the current behavior?

When setting runtimeChunk:single, or specifying a separate runtimeChunk. Module are not hoisted correctly.

externals and webpack/container/reference/name modules are hoisted to the entry point chunks, however module federation is a runtime module and when it initializes it will registerShare, then initExternal.

  • If there are multiple entrypoints, and some entry points do not import a remote module thats listed in remotes
  • If the other entry point is not loaded on the page

Then you will get failed to init external , call of undefined warning because not all the container/refernce modules are in the __webpack_modules__ factory, as the other entry chunks may only show up or load for another route or later in the application.

When runtimeChunk is not set to single, the modules are hoisted correctly to the top entry. But when there is a runtimeChunk single, the modules only hoist to the entry point not the root chunk (runtime chunk)

If you share a module as eager, it does the same - it will never hoist into the runtime where it is supposed to be.

image

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

Set runtimeChunk to single, add 2 entrypoints - each entrypoint imports a different remote, load only 1 entrypoint on the page and you will see init failure warning for the other remote in the other entrypoint

What is the expected behavior?

Container References, Eager Modules, and Externals should hoist to the highest possible location, the runtime chunks they belong to.

image

Other relevant information: webpack version: 5.95 Node.js version: 20 Operating System: macos Additional tools: module federation

ScriptedAlchemy avatar Sep 27 '24 20:09 ScriptedAlchemy

Reference hoisting is also used in v2 as a way to hoist the injected npm packages that constitue the new module federation runtime. Since splitChunks will move our node modules out of eager consumption for the remote or host. I use ModuleFederationPlugin.getcompilationhooks().addFederationRuntimeDependency(dep) - which Hoist plugin will track all eager referenced modules and move them back into runtime chunk as well. Ensuing federation v2 runtime is eager and can be webpack_require inside a RuntimeModule

ScriptedAlchemy avatar Sep 27 '24 21:09 ScriptedAlchemy

@ScriptedAlchemy Fixed by https://github.com/webpack/webpack/pull/18811?

alexander-akait avatar Oct 21 '24 16:10 alexander-akait

Yes fixed by this.

ScriptedAlchemy avatar Oct 23 '24 01:10 ScriptedAlchemy

I tried upgrading to v5.96.1, but I still cannot enable this in my webpack config:

    optimization: {
     runtimeChunk: 'single',
    },

Is there anything else I need to do? When using dev server I just get a blank screen, and no errors logged in the console.

I only ask since I saw it was mentioned in these release notes: https://github.com/webpack/webpack/releases/tag/v5.96.0

einarq avatar Nov 08 '24 11:11 einarq

@einarq Can you create reproducible repository?

alexander-akait avatar Nov 08 '24 11:11 alexander-akait

Single runtime chunk will require more work than just this PR. This fixes the reference issue. The remote itself will still require the webpack runtime chunk to be loaded as well if you're trying to load remote entry off its host who has single set.

ScriptedAlchemy avatar Nov 08 '24 19:11 ScriptedAlchemy

Set runtime:false on mf plugin if the remote is to be used outside it's own host

ScriptedAlchemy avatar Nov 08 '24 19:11 ScriptedAlchemy

Not sure I follow all that, sorry. My main goal is to be able to re-enable the single runtime chunk in the app serving the remoteEntry, so that we don’t de-optimize apps by using using module federation to share modules. On 8 Nov 2024, at 20:08, Zack Jackson @.***> wrote: Set runtime:false on mf plugin if the remote is to be used outside it's own host

—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you were mentioned.Message ID: @.***>

einarq avatar Nov 08 '24 19:11 einarq

Add this to federation plugin

runtime: false

ScriptedAlchemy avatar Nov 08 '24 20:11 ScriptedAlchemy