[Bug]: Module Federation - Remote app fails to load when running with a base path

[danantal]

Version

System:
OS: Windows 11 10.0.22631
CPU: (32) x64 AMD Ryzen 9 3950X 16-Core Processor
Memory: 43.63 GB / 63.92 GB
Browsers:
Edge: Chromium (129.0.2792.89)
Internet Explorer: 11.0.22621.3527
npmPackages:
@rsbuild/core: ^1.0.16 => 1.0.16
@rsbuild/plugin-react: ^1.0.5 => 1.0.5

Details

I have a setup with 2 apps:

1. Host - running on localhost:3000 with no server base path
2. Remote - running on localhost:3001/foo/ with a server base path set to /foo

Trying to configure the host app to consume the remote app with the following config:

moduleFederation: {
    options: {
      name: 'host',
      remotes: {
        remote: 'remote@http://localhost:3001/foo/remoteEntry.js',
      },
      shared: {
        ...dependencies,
        react: {
          singleton: true,
          requiredVersion: dependencies['react'],
        },
        'react-dom': {
          singleton: true,
          requiredVersion: dependencies['react-dom'],
        },
      },
    },

The initial request for the remoteEntry.js file succeeds, but it fails when trying to load the dependencies of the remote app. It seems those requests are issued towards the host app port (3000) instead of the remote app port (3001). The network request responds with the html of the host app.

I've checked the code and there is a comment about that being intended though, so that HMR works, but I'm not sure why it then works fine if we remove the server base path of /foo on the remote app (the request is then made to the correct port of 3001).

I've also tried setting the dev client port explicitly, but it still fails.

  dev: {
    client: {
      port: 3001
    }
  },

Reproduce link

https://github.com/danantal/rsbuild-demo

Reproduce Steps

1. run pnpm i
2. run pnpm --filter=host dev
3. run pnpm --filter=remote dev

Expected: page loads correctly
Actual: page fails to load due to incorrect request for the deps of remote app.

[chenjiahan]

I have reproduced this issue, a workaround is to manually configure dev.assetPrefix:

export default defineConfig({
  server: {
    base: '/foo',
    port: 3001
  },
  dev: {
   // add this
    assetPrefix: 'http://localhost:<port>/foo/'
  },
});

[danantal]

I can confirm the real fix works in 1.0.17. Thanks again for the quick action :)