[Bug]: @loadable/component no longer works with v 1.7.0

[paulincai]

System Info

System:
OS: macOS 26.1
CPU: (8) arm64 Apple M1
Memory: 96.61 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 22.21.1 - /opt/homebrew/bin/node
npm: 10.9.4 - /opt/homebrew/bin/npm
Browsers:
Chrome: 143.0.7499.170
npmPackages:
@rspack/cli: 1.6.8 => 1.6.8
@rspack/core: 1.6.8 => 1.6.8
@rspack/plugin-react-refresh: ^1.5.3 => 1.5.3

Details

In all my projects (Meteor 3.4-rc.1), updating these two packages:

"@rspack/cli": "1.6.8",
"@rspack/core": "1.6.8",
to 1.7.0 results in the following errors:

In the browser page:
ERROR Problem communicating active modules to the server at http://192.168.1.72:3600/build-chunks/imports_startup_client_routes_js_lazy-compilation-proxy.js:32:11 at Set.forEach () at activeEventSource.onerror (http://192.168.1.72:3600/build-chunks/imports_startup_client_routes_js_lazy-compilation-proxy.js:30:21)

In the browser console:
EventSource's response has a MIME type ("text/html") that is not "text/event-stream". Aborting the connection.Understand this error loadable.esm.mjs:146 loadable-components: failed to asynchronously load component Object (anonymous) @ loadable.esm.mjs:146Understand this error lazy-compilation-web.js:29 Uncaught Error: Problem communicating active modules to the server at lazy-compilation-web.js:29:1 at Set.forEach () at activeEventSource.onerror (lazy-compilation-web.js:27:1)
I use @loadable/component for my dynamic imports:

import loadable from '@loadable/component'

const Component = loadable(() => import('./SomePath/Component.js'))
Downgrade back to 1.6.8 and everything works fine.

MeteorJS has moved from Babel to Rspack in its latest version (3.4), still in RC stage. However the problem is probably not related to MeteorJS, but rather to dynamic imports with loadable.

Reproduce link

No response

Reproduce Steps

1. update to 1.7.0 for @rspack/core and @rspack/cli
2. use @loadable/component in a React project.
3. use a dynamic import with loadable.

[stormslowly]

@paulincai could you plz share me a simple project that using rspack and meteor 3.4-rc.1? (i can reproduce the issue by myself.)

From the logs you provided, i am guessing it's maybe related to public path config or lazycompilation's serverUrl Config.

[stormslowly]

I have reproduced this problem using the following repository https://github.com/stormslowly/rspack_with_meteor_34rc1

The root cause of the issue is outlined below:

1. Lazy Compilation: The package @rspack/cli@1.7 enables lazy compilation by default. When using Meteor, the Rspack development server starts on the default port, which is 8080, meaning lazy compilation is active.

2. Asset Hosting: Meteor hosts Rspack development assets at localhost:3000/build-chunks/xxx.js. These assets are ultimately proxied to the Rspack development server at localhost:8080/xxx.js.

3. Request URLs: By default, lazy-compiled modules make requests to /lazy-compilation-using-..., which resolves to localhost:3000/lazy-compilation-using-.... This is not the correct endpoint, so all dynamically imported modules fail to load.

4. Correct Endpoint: The correct URL that should be used is localhost:8080/lazy-compilation-using-....

To resolve this issue, there are two possible solutions:

1. Adjust Configuration: Change the configuration to point to the correct endpoint by setting lazyCompilation: { serverUrl: "http://localhost:8080/" }.

2. Disable Lazy Compilation: Alternatively, you can disable lazy compilation by setting lazyCompilation: false.