fix(nextjs-mf): production build issues during next compile

.changeset/gold-emus-care.md

@@ -0,0 +1,5 @@
+---
+'@module-federation/nextjs-mf': patch
+---
+
+Fix production build issue causing errorLoadRemote hook to not execute during next static render

.github/workflows/build-and-test.yml

@@ -8,31 +8,62 @@ on:
 jobs:
   main:
     runs-on: ubuntu-latest
-    # Cancel any previous runs in progress
     concurrency:
       group: ${{ github.head_ref || github.run_id }}
       cancel-in-progress: true
     steps:
-      - uses: actions/checkout@v3
+      - name: Checkout Repository
+        uses: actions/checkout@v3
         with:
           fetch-depth: 0
+
       - name: Install Pnpm
         run: corepack enable
+
       - name: Setup Node.js 18
         uses: actions/setup-node@v3
         with:
           node-version: '18'
           cache: 'pnpm'
-      - uses: nrwl/nx-set-shas@v3
-      - run: pnpm install
-      - run: npx cypress install
-      - run: npx nx format:check
-      - run: npx nx affected -t build --parallel=10 --exclude='*,!tag:package'
-      - run: npx nx affected -t lint --parallel=7 --exclude='*,!tag:package'
-      - run: npx nx affected -t test --parallel=3 --exclude='*,!tag:package'
-      - run: npx nx run-many --target=serve --projects=3000-home,3001-shop,3002-checkout --parallel=3 & echo "done"
-      - run: sleep 10 && npx nx run-many --target=test:e2e --projects=3000-home,3001-shop,3002-checkout --parallel=1
-      - run: lsof -ti tcp:3000,3001,3002 | xargs kill
-      - run: npx nx run-many --target=serve --projects=3005-runtime-host,3006-runtime-remote,3007-runtime-remote --parallel=3 & echo "done"
-      - run: sleep 6 && npx nx run-many --target=test:e2e --projects=3005-runtime-host --parallel=1
-      - run: lsof -ti tcp:3005,3006,3006 | xargs kill
+
+      - name: Set Nx SHA
+        uses: nrwl/nx-set-shas@v3
+
+      - name: Install Dependencies
+        run: pnpm install
+
+      - name: Install Cypress
+        run: npx cypress install
+
+      - name: Check Code Format
+        run: npx nx format:check
+
+      - name: Run Affected Build
+        run: npx nx affected -t build --parallel=10 --exclude='*,!tag:package'
+
+      - name: Run Affected Lint
+        run: npx nx affected -t lint --parallel=7 --exclude='*,!tag:package'
+
+      - name: Run Affected Test
+        run: npx nx affected -t test --parallel=3 --exclude='*,!tag:package'
+
+      - name: Serve Projects 3000-home, 3001-shop, 3002-checkout
+        run: npx nx run-many --target=serve --projects=3000-home,3001-shop,3002-checkout --parallel=3 & echo "done"
+
+      - name: E2E Test for 3000-home, 3001-shop, 3002-checkout
+        run: sleep 10 && npx nx run-many --target=test:e2e --projects=3000-home,3001-shop,3002-checkout --parallel=1
+
+      - name: Kill Processes on Ports 3000, 3001, 3002
+        run: lsof -ti tcp:3000,3001,3002 | xargs kill
+
+      - name: Serve Projects 3005-runtime-host, 3006-runtime-remote, 3007-runtime-remote
+        run: npx nx run-many --target=serve --projects=3005-runtime-host,3006-runtime-remote,3007-runtime-remote --parallel=3 & echo "done"
+
+      - name: E2E Test for 3005-runtime-host
+        run: sleep 6 && npx nx run-many --target=test:e2e --projects=3005-runtime-host --parallel=1
+
+      - name: Kill Processes on Ports 3005, 3006, 3007
+        run: lsof -ti tcp:3005,3006,3007 | xargs kill
+
+      - name: Build Next.js Apps in Production Mode
+        run: pnpm app:next:prod

apps/3000-home/project.json

@@ -6,7 +6,6 @@
   "targets": {
     "build": {
       "executor": "@nx/next:build",
-      "outputs": ["{options.outputPath}"],
       "defaultConfiguration": "production",
       "options": {
         "outputPath": "dist/apps/3000-home"

apps/3001-shop/project.json

@@ -6,7 +6,6 @@
   "targets": {
     "build": {
       "executor": "@nx/next:build",
-      "outputs": ["{options.outputPath}"],
       "defaultConfiguration": "production",
       "options": {
         "outputPath": "apps/3001-shop/dist"

apps/3002-checkout/project.json

@@ -6,7 +6,6 @@
   "targets": {
     "build": {
       "executor": "@nx/next:build",
-      "outputs": ["{options.outputPath}"],
       "defaultConfiguration": "production",
       "options": {
         "outputPath": "{options.outputPath}"

package.json

@@ -31,7 +31,7 @@
     "extract-i18n:website": "nx run website:extract-i18n",
     "sync:pullMFTypes": "concurrently \"node ./packages/enhanced/pullts.js\"",
     "app:next:dev": "nx run-many --target=serve --configuration=development -p 3000-home,3001-shop,3002-checkout",
-    "app:next:prod": "nx run-many --target=serve --configuration=production -p 3000-home,3001-shop,3002-checkout",
+    "app:next:prod": "nx run-many --target=build --configuration=production -p 3000-home,3001-shop,3002-checkout",
     "app:runtime:dev": "nx run-many --target=serve -p 3005-runtime-host,3006-runtime-remote,3007-runtime-remote",
     "commitlint": "commitlint --edit",
     "prepare": "husky install",

packages/nextjs-mf/src/plugins/NextFederationPlugin/index.ts

@@ -64,6 +64,8 @@ export class NextFederationPlugin {
       compiler,
       isServer,
     );
+    // ContainerPlugin will get NextFederationPlugin._options, so NextFederationPlugin._options should be the same as normalFederationPluginOptions
+    this._options = normalFederationPluginOptions;
     new ModuleFederationPlugin(normalFederationPluginOptions).apply(compiler);
   }
 

packages/nextjs-mf/src/plugins/container/runtimePlugin.ts

@@ -4,6 +4,7 @@ export default function (): FederationRuntimePlugin {
   return {
     name: 'next-internal-plugin',
     errorLoadRemote({ id, error, from, origin }) {
+      console.error(id, 'offline');
       const pg = function () {
         console.error(id, 'offline', error);
         return null;