client side javascript is not working in react-18-ssr example

[wibed]

using react-18-ssr https://github.com/module-federation/module-federation-examples/tree/master/react-18-ssr

example i am stuck at using client side javascript.
anyone experiencing the same issue?

i tried, to no success,

• adjusting the chunks and how they split:
  ('initial' && 'all' does make the app render, but client side javascript is non functional)

optimization: { splitChunks: { chunks: 'async' || 'initial' || 'false' || 'all'} }

• aswell as a more complicated approach

optimization: {
      splitChunks: {
        cacheGroups: {
          defaultVendors: {
            name: `chunk-vendors`,
            test: /[\\/]node_modules[\\/]/,
            priority: -10,
            chunks: 'async',
            reuseExistingChunk: true
          },
          common: {
            name: `chunk-common`,
            minChunks: 2,
            priority: -20,
            chunks: 'async',
            reuseExistingChunk: true
          }
        }
      }
    }

related issue:
#1116
#307
#1273
#692
#2799

( the answers does not provide a solution though)

[ScriptedAlchemy]

Seems to work here:

I updated the node federation plugin instance on it as well.

#3125

Dont mess with chunk splits, this can cause collisions in webpack graph

[wibed]

@ScriptedAlchemy

i had a look at your fix branch origin/fix_react_18_example
i couldnt reproduce the success of it.

flashing (it loads for a split second and unloads again, see video) still occurs ootb, and if i try disabling split chunks. the clientside javascript does not load at all

demo.mp4

EDIT:
including the error from the console

ScriptExternalLoadError: Loading script failed.
(missing: http://localhost:3001/client/remoteEntry.js)
while loading "./Content" from 9223
    9223 remoteEntry.js":1
    Webpack 13
[react-dom.production.min.js:189:29](webpack://react-ssr/node_modules/react-dom/cjs/react-dom.production.min.js)
    React 9
    S scheduler.production.min.js:13
    T scheduler.production.min.js:14
    exports _invoke.js:5
    <anonymous> _task.js:35
    b _task.js:21
    x _task.js:25
    (Async: EventHandlerNonNull)
    9124 _task.js:57
    Webpack 11

EDIT2:

How did you get it to work?
i tested it on

• safari
• firefox
• google chrome

none of which had your result.

[ScriptedAlchemy]

contact valor software if you are stuck, in my orgs main readme

[wibed]

kindly reopen, i just tested it again. fresh download, yarn && yarn start.
as per readme

maybe one of the community managed to get a success

[wibed]

#957

found this little gem. the last comment did the trick for me

I ran into this issue and the problem ended up being running the host app in VSCode terminal instead of the OS terminal

awesome if it could be included in the docs somehow.