Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

17.2 broke our MFE remotes with all remotes on same port #20974

Closed
1 of 4 tasks
rbirkgit opened this issue Jan 2, 2024 · 9 comments
Closed
1 of 4 tasks

17.2 broke our MFE remotes with all remotes on same port #20974

rbirkgit opened this issue Jan 2, 2024 · 9 comments
Assignees
Labels
outdated scope: angular Issues related to Angular support in Nx scope: module federation Issues related to module federation support type: bug

Comments

@rbirkgit
Copy link

rbirkgit commented Jan 2, 2024

Current Behavior

With 17.2 all remotes now start on the same port when in static mode, but on different ports when in dev mode. This breaks our env and we can no longer update to 17.2 or higher.

Expected Behavior

We expect a revert of this feature of having all remotes on same port, or an easy way to go back to how it was with 17.1.

GitHub Repo

No response

Steps to Reproduce

Have a repo with MFE remotes and update to 17.2

Nx Report

Node   : 18.14.0
   OS     : win32-x64
   yarn   : 4.0.1

   nx                 : v17.2.5
   @nx/js             : v17.2.5
   @nx/jest           : v17.2.5
   @nx/linter         : v17.2.5
   @nx/eslint         : v17.2.5
   @nx/workspace      : v17.2.5
   @nx/angular        : v17.2.5
   @nx/cypress        : v17.2.5
   @nx/devkit         : v17.2.5
   @nx/eslint-plugin  : v17.2.5
   @nrwl/tao          : v17.2.5
   @nx/web            : v17.2.5
   @nx/webpack        : v17.2.5
   typescript         : 4.9.5
   ---------------------------------------
   Community plugins:
   ng-mocks : 14.11.0

Failure Logs

No response

Package Manager Version

No response

Operating System

  • macOS
  • Linux
  • Windows
  • Other (Please specify)

Additional Information

In our hosts proxy config file we have this but cannot figure out how to support different port numbers/path depending on static or dev mode and why we need the static ports remain on different ports, i.e. same as in dev mode.

  "/myhost/plugin/billing": {
    "target": "https://localhost.mycompany.com:4203",
    "secure": false,
    "logLevel": "debug",
    "pathRewrite": {
      "^/myhost/plugin/billing": ""
    }
  }
@rbirkgit
Copy link
Author

rbirkgit commented Jan 9, 2024

This is blocking us from updating to 17.2 or higher. Any suggestions?

@AgentEnder AgentEnder added scope: angular Issues related to Angular support in Nx scope: module federation Issues related to module federation support labels Jan 9, 2024
@glp
Copy link

glp commented Jan 17, 2024

This is a general problem with the new static-serve and mfe regardless of framework. We are using react and are currently also running into this problem, because we can no longer route to the correct module. (static vs devRemotes)

@smasala
Copy link
Contributor

smasala commented Feb 11, 2024

@rbirkgit in the project.json of the host application add the name of the remotes again

"serve": {
      "executor": "@nx/react:module-federation-dev-server",
      "defaultConfiguration": "development",
      "options": {
        "buildTarget": "host-app:build",
        "hmr": true,
        "port": 4200,
        "devRemotes": ["remote-app-name"] // same as in host-app/module-federation.config.ts
      },

This then forces the correct port to be pulled as defined in the remote-app serve section ->

options.staticRemotesPort = options.devRemotes.reduce((portToUse, r) => {

@leosvelperez is this intentional (did the jump from 16.4.2)?

@rbirkgit
Copy link
Author

@smasala That will start the remotes in devRemote mode. That has not been an issue. The problem is when starting them in static mode (which is much faster), the ports are all the same. Then switching to devMode (if you need to debug a remote), it will not use the same port number.

@glp
Copy link

glp commented Apr 3, 2024

This also does not work for projects with dynamic module federation, as the app has no way of knowing if the remote is served via static or devRemote, making it impossible to load the remoteEntry file.

@kevinriemens
Copy link

This isssue is still present in 19.0.0

@rbirkgit
Copy link
Author

rbirkgit commented May 7, 2024

With 18.2.4+ the old behavior magically came back, with each remote on separate ports. I should have mentioned it.

Tested 19.0 and it works fine there and still using separate ports.

@Coly010
Copy link
Contributor

Coly010 commented May 17, 2024

Closed as fixed, thanks for raising the issue!

@Coly010 Coly010 closed this as completed May 17, 2024
Copy link

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Jun 17, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
outdated scope: angular Issues related to Angular support in Nx scope: module federation Issues related to module federation support type: bug
Projects
None yet
Development

No branches or pull requests

6 participants