module-federation/module-federation-examples

@module-federation/nextjs-mf breaks from version 8.8.24 and onwards

Opened this issue · 0 comments

@module-federation/nextjs-mf breaks from version 8.8.24 and onwards. It works for v8.8.23 and below.

Here is the error

react.development.js:1487 Uncaught TypeError: Cannot read properties of null (reading 'useLayoutEffect')
at exports.useLayoutEffect (react.development.js:1487:33)
at Root (index.js:420:20)
at react-stack-bottom-frame (react-dom-client.development.js:22429:20)
at renderWithHooks (react-dom-client.development.js:5758:22)
at updateFunctionComponent (react-dom-client.development.js:8019:19)
at beginWork (react-dom-client.development.js:9684:18)
at runWithFiberInDEV (react-dom-client.development.js:544:16)
at performUnitOfWork (react-dom-client.development.js:15045:22)
at workLoopSync (react-dom-client.development.js:14871:41)
at renderRootSync (react-dom-client.development.js:14851:11)
at performWorkOnRoot (react-dom-client.development.js:14385:44)
at performWorkOnRootViaSchedulerTask (react-dom-client.development.js:15932:7)
at MessagePort.performWorkUntilDeadline (scheduler.development.js:44:48)

Here is the next.config.js file

// eslint-disable-next-line @typescript-eslint/no-var-requires
const { composePlugins, withNx } = require('@nx/next');
const { NextFederationPlugin } = require('@module-federation/nextjs-mf');

const remotes = (isServer) => {
  const location = isServer ? 'ssr' : 'chunks';
  return {
    remote: `remote@${process.env.NEXT_PUBLIC_REMOTE_URL}/_next/static/${location}/remoteEntry.js`,
  };
};

/**
 * @type {import('@nx/next/plugins/with-nx').WithNxOptions}
 **/
const nextConfig = {
  nx: {
    // Set this to true if you would like to use SVGR
    // See: https://github.com/gregberge/svgr
    svgr: false,
  },
  webpack: (config, options) => {
    config.plugins.push(
      new NextFederationPlugin({
        exposes: {},
        extraOptions: {},
        filename: 'static/chunks/remoteEntry.js',
        name: 'host',
        remotes: remotes(options.isServer),
      })
    );

    return config;
  },
};

const plugins = [
  // Add more Next.js plugins to this list if needed.
  withNx,
];

module.exports = composePlugins(...plugins)(nextConfig);

Reproduction:
https://github.com/adit-shah-devrev/module-federation-preload