fix(react): setup mf env var as input for rspack (#29584)

## Current Behavior
The Module Federation `NxRuntimeLibraryControlPlugin` relies on an
environment variable that is set during the build/serve process.
This could potentially lead to issues with cache restoration.

The impact should be minimal as the runtime control plugin should only
be added to the module federation config when the env var is set.
It should only be set by the `module-federation-dev-server` executor
which is invoked during serve - a non-cacheable task already.

## Expected Behavior
Ensure the env var is set as an input to ensure maximum accuracy with
module federation builds via rspack executor

Author: Coly010

packages/react/migrations.json

@@ -47,6 +47,12 @@
       "version": "20.3.0-beta.2",
       "description": "If workspace includes Module Federation projects, ensure the new @nx/module-federation package is installed.",
       "factory": "./src/migrations/update-20-3-0/ensure-nx-module-federation-package"
+    },
+    "add-mf-env-var-to-target-defaults": {
+      "cli": "nx",
+      "version": "20.4.0-beta.0",
+      "description": "Add NX_MF_DEV_REMOTES to inputs for task hashing when '@nx/webpack:webpack' or '@nx/rspack:rspack' is used for Module Federation.",
+      "factory": "./src/migrations/update-18-0-0/add-mf-env-var-to-target-defaults"
     }
   },
   "packageJsonUpdates": {

packages/react/src/generators/host/host.ts

@@ -146,7 +146,7 @@ export async function hostGenerator(
     );
   }
 
-  addMfEnvToTargetDefaultInputs(host);
+  addMfEnvToTargetDefaultInputs(host, options.bundler);
 
   const installTask = addDependenciesToPackageJson(
     host,

packages/react/src/generators/remote/remote.ts

@@ -218,7 +218,7 @@ export async function remoteGenerator(host: Tree, schema: Schema) {
     );
   }
 
-  addMfEnvToTargetDefaultInputs(host);
+  addMfEnvToTargetDefaultInputs(host, options.bundler);
 
   const installTask = addDependenciesToPackageJson(
     host,

packages/react/src/migrations/update-18-0-0/add-mf-env-var-to-target-defaults.ts

@@ -8,10 +8,11 @@ import {
 import { addMfEnvToTargetDefaultInputs } from '../../utils/add-mf-env-to-inputs';
 
 export default async function (tree: Tree) {
-  if (!hasModuleFederationProject(tree)) {
+  const bundler = hasModuleFederationProject(tree);
+  if (!bundler) {
     return;
   }
-  addMfEnvToTargetDefaultInputs(tree);
+  addMfEnvToTargetDefaultInputs(tree, bundler);
 
   await formatFiles(tree);
 }
@@ -22,15 +23,18 @@ function hasModuleFederationProject(tree: Tree) {
     const targets = project.targets || {};
     for (const [_, target] of Object.entries(targets)) {
       if (
-        target.executor === '@nx/webpack:webpack' &&
-        (tree.exists(
+        tree.exists(
           joinPathFragments(project.root, 'module-federation.config.ts')
         ) ||
-          tree.exists(
-            joinPathFragments(project.root, 'module-federation.config.js')
-          ))
+        tree.exists(
+          joinPathFragments(project.root, 'module-federation.config.js')
+        )
       ) {
-        return true;
+        if (target.executor === '@nx/webpack:webpack') {
+          return 'webpack';
+        } else if (target.executor === '@nx/rspack:rspack') {
+          return 'rspack';
+        }
       }
     }
   }

packages/react/src/utils/add-mf-env-to-inputs.ts

@@ -1,28 +1,29 @@
 import { type Tree, readNxJson, updateNxJson } from '@nx/devkit';
 
-export function addMfEnvToTargetDefaultInputs(tree: Tree) {
+export function addMfEnvToTargetDefaultInputs(
+  tree: Tree,
+  bundler: 'rspack' | 'webpack'
+) {
   const nxJson = readNxJson(tree);
-  const webpackExecutor = '@nx/webpack:webpack';
+  const executor =
+    bundler === 'rspack' ? '@nx/rspack:rspack' : '@nx/webpack:webpack';
   const mfEnvVar = 'NX_MF_DEV_REMOTES';
 
   nxJson.targetDefaults ??= {};
-  nxJson.targetDefaults[webpackExecutor] ??= {};
-  nxJson.targetDefaults[webpackExecutor].inputs ??= [
-    'production',
-    '^production',
-  ];
-  nxJson.targetDefaults[webpackExecutor].dependsOn ??= ['^build'];
+  nxJson.targetDefaults[executor] ??= {};
+  nxJson.targetDefaults[executor].inputs ??= ['production', '^production'];
+  nxJson.targetDefaults[executor].dependsOn ??= ['^build'];
 
   let mfEnvVarExists = false;
-  for (const input of nxJson.targetDefaults[webpackExecutor].inputs) {
+  for (const input of nxJson.targetDefaults[executor].inputs) {
     if (typeof input === 'object' && input['env'] === mfEnvVar) {
       mfEnvVarExists = true;
       break;
     }
   }
   if (!mfEnvVarExists) {
-    nxJson.targetDefaults[webpackExecutor].inputs.push({ env: mfEnvVar });
+    nxJson.targetDefaults[executor].inputs.push({ env: mfEnvVar });
   }
-  nxJson.targetDefaults[webpackExecutor].cache = true;
+  nxJson.targetDefaults[executor].cache = true;
   updateNxJson(tree, nxJson);
 }