Fetching remoteEntry.js file from a remote source on the server

Hey everyone, First of all thanks a lot for the amazing work on module federation. I was wondering if it is possible to fetch the remoteEntry.js file from a remote source on the server. I know for client this is possible and was wondering if the same was possible on the server instead of fetching from the filesystem.

[7rulnik]

It’s possible. You can do it in this way:

   const remote = `new Promise(async resolve => {
  const content =  await someFetchFunction('http://hostname/appB/b-entry.js')
  const chunk = {}
  require('vm').runInThisContext('(function(exports, require, __dirname, __filename) {' + content + '\\n})')(chunk, require, 'some-fake-path', 'b-entry.js');
  resolve(chunk)
})`

    new webpack.container.ModuleFederationPlugin({
      remotes: {
        'b-entry': `promise ${remote}`
      },
    }),

Logic with require('vm') taken from webpack async-node target. Note that someFetchFunction should be defined somewhere in user-land code.

But it doesn’t solve the problem at all because you will need a way to fetch remote chunks via HTTP. To do this you have 2 ways:

1. Teach webpack to fetch chunks over http. It’s pretty risky and requires a custom chunk loading runtime. I will open-source it later. See https://github.com/webpack/webpack/issues/12084
2. Fetch and save remote chunks on same file system (or use some shared FS)

[jacob-ebey]

@7rulnik pretty much nailed what the http chunk loading plugin does. There are some other changes needed in the webpack chunk loading runtime that’s embeded into the remote entry otherwise it will try to load chunks from local disk instead of over the network.