Error "remoteEntryExports is undefined" when loading a remote application in a Pure ESM Project

[hoo00nn]

Describe the bug

Hello. First, I would like to thank you for providing such a great library, which has been a tremendous help in building MFA.

What I am trying to achieve in my project is to integrate a remote application at runtime during the SSR process to generate HTML.

I am using NestJS as the SSR server. Everything seems to be working fine, but I encountered one issue. In a NestJS project configured with pure ESM, an error occurs when trying to load a remote application via loadRemote provided by @module-federation/runtime

Error: [ Federation Runtime ]: remoteEntryExports is undefined 
{
  "name": "myapp",
  "entry": "http://localhost:3004/server/remoteEntry.js",
  "shareScope": "default",
  "type": "global",
  "entryGlobalName": "myapp"
}

The host application is a pure ESM-configured NestJS application, and the remote application exposes React components using Webpack.

Are there any considerations for using the runtime API in an ESM-configured application when dealing with remotes? I have confirmed that it works correctly in a NestJS application using the CJS module format.

I have created a small repository for testing. The repository contains a NestJS application in ESM module format, a NestJS application in CJS format, and a remote application. You can experience the error when running the server in ESM.

From my investigation, it seems the error is triggered when executing this code

I would appreciate any help on this issue.

Reproduction

https://github.com/hoo00nn/module-federation-esm

Used Package Manager

pnpm

System Info

System:
OS: macOS 14.1
CPU: (12) arm64 Apple M3 Pro
Memory: 31.67 MB / 18.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 20.14.0 - ~/.nvm/versions/node/v20.14.0/bin/node
Yarn: 1.22.21 - /opt/homebrew/bin/yarn
npm: 10.7.0 - ~/.nvm/versions/node/v20.14.0/bin/npm
pnpm: 8.15.7 - ~/.nvm/versions/node/v20.14.0/bin/pnpm
Browsers:
Chrome: 125.0.6422.77
Safari: 17.1

Validations

• [x] Read the docs.
• [x] Read the common issues list.
• [x] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [x] Make sure this is a Module federation issue and not a framework-specific issue.
• [x] The provided reproduction is a minimal reproducible example of the bug.

[ScriptedAlchemy]

ESM wont work on servers, SSR has to consume commonjs remote.

[hoo00nn]

ESM wont work on servers, SSR has to consume commonjs remote.

@ScriptedAlchemy Thank you for your response. There are a few points I would like to clarify.

I understand that it is possible to load CommonJS modules in an ESM environment. When you mentioned that ESM cannot be used on the server, were you referring specifically to using it with @module-federation/runtime?

Currently, the Remote App is built using CommonJS. In order to use it, does the NestJS server responsible for SSR also need to be configured as CommonJS?

[ScriptedAlchemy]

It depends. I haven't personally tried this. But if you use import to load them, then there's no way to release the require cache to reload the server with updated remotes in ESM. If you use loadRemote, then it should be fine as long as the code you're loading works in eval-like cases. You can't eval ESM because it's not a script, so it throws a syntax error.

We use vm.runInThisContext to execute federation remotes. That means it will want scripts, not modules. The host should be fine in ESM as long as you don't need to refresh the server or don't use import from, which requires us to clear the require cache to fetch new chunks when remotes are updated.

[github-actions[bot]]

Stale issue message