module-federation-examples icon indicating copy to clipboard operation
module-federation-examples copied to clipboard

nextjs mf does not generate remoteEntry.js

Open tryptamine25 opened this issue 1 year ago • 0 comments

I was using nextjs as a host application, but it got so bad - any changes require a reboot of the dev server, during the build on the server memory consumption went from 2gb to 10gb, that I decided to try to use nextjs application as a remote application. Here is my next.config.js:

/** @type {import('next').NextConfig} */
const NextFederationPlugin = require('@module-federation/nextjs-mf');

const nextConfig = ({
  reactStrictMode: false,
  swcMinify: true,
  basePath: '/new',
  env: {
    NEXT_PUBLIC_FRONTOFFICE_OPENAPI_URL: process.env.NEXT_PUBLIC_FRONTOFFICE_OPENAPI_URL,
    NEXT_PUBLIC_FRONTOFFICE_CLIENT_API_URL: process.env.NEXT_PUBLIC_FRONTOFFICE_CLIENT_API_URL,
    EDO_LIGHT_API_URL: process.env.EDO_LIGHT_API_URL
  },
  module: {
    parser: {
      javascript: {
        dynamicImportMode: "eager"
      }
    }
  },
  webpack: (config) => {
    config.plugins.push(
      new NextFederationPlugin({
        name: "FrontOffice",
        filename: 'static/chunks/remoteEntry.js',
        exposes: {
          "./FrontOffice": "./pages/_app",
        },
        remotes: {
          "Stepper": `Stepper@${process.env.STEPPER_HOST}/remoteEntry.js`,
          "Payments": `FrontOfficePayments@${process.env.PAYMENTS_HOST}/remoteEntry.js`,
        },
      })
    );
    return config;
  },
  async redirects() {
    return [
      {
        source: '/profile',
        destination: '/profile/customer',
        permanent: false,
      },
      {
        source: '/',
        destination: '/profile',
        permanent: false,
        has: [
          {
            type: 'cookie',
            key: 'auth.accessToken',
          }
        ]
      },
      {
        source: '/profile/payments/payroll',
        destination: '/profile/payments',
        permanent: false,
      },
      {
        source: '/profile/payments/direct-payments',
        destination: '/profile/payments',
        permanent: false,
      },
    ];
  }
});

module.exports = nextConfig;

And at http://localhost:3000/new/static/chunks/remoteEntry.js Or http://localhost:3000/static/chunks/remoteEntry.js I get a 404 error

"next": "12.2.5", "@module-federation/nextjs-mf": "^7.0.8", "webpack": "^5.89.0"

tryptamine25 avatar May 02 '24 10:05 tryptamine25