fix(module-federation): ensure @nx/module-federation package is installed for users (#29416)

Coly010 · web-flow · commit 656d69b46627 · 2024-12-19T14:09:48.000Z
## Current Behavior The `@nx/module-federation` package is a direct dependency of some of the other packages in the Nx Plugin ecosystem. It should be resolved correctly by package managers such that it can be used when setting up MF projects. However, some users are facing issues with module resolutions where the package is not found as expected. ## Expected Behavior Install the package directly for the user to ensure module resolution works as expected. ## Related Issue(s) Fixes #29269
diff --git a/packages/angular/migrations.json b/packages/angular/migrations.json
@@ -332,6 +332,12 @@
       },
       "description": "Remove the deprecated 'tailwindConfig' option from ng-packagr executors. Tailwind CSS configurations located at the project or workspace root will be picked up automatically.",
       "factory": "./src/migrations/update-20-2-0/remove-tailwind-config-from-ng-packagr-executors"
+    },
+    "ensure-nx-module-federation-package": {
+      "cli": "nx",
+      "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"
     }
   },
   "packageJsonUpdates": {
diff --git a/packages/angular/src/generators/setup-mf/setup-mf.ts b/packages/angular/src/generators/setup-mf/setup-mf.ts
@@ -51,6 +51,7 @@ export async function setupMf(tree: Tree, rawOptions: Schema) {
         {
           '@nx/web': nxVersion,
           '@nx/webpack': nxVersion,
+          '@nx/module-federation': nxVersion,
         }
       );
     }
@@ -82,6 +83,7 @@ export async function setupMf(tree: Tree, rawOptions: Schema) {
         {
           '@nx/webpack': nxVersion,
           '@module-federation/enhanced': moduleFederationEnhancedVersion,
+          '@nx/module-federation': nxVersion,
         }
       );
     }
diff --git a/packages/angular/src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package.ts b/packages/angular/src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package.ts
@@ -3,9 +3,11 @@ import {
   formatFiles,
   readProjectConfiguration,
   visitNotIgnoredFiles,
+  addDependenciesToPackageJson,
 } from '@nx/devkit';
 import { forEachExecutorOptions } from '@nx/devkit/src/generators/executor-options-utils';
 import { tsquery } from '@phenomnomnominal/tsquery';
+import { nxVersion } from '../../utils/versions';
 
 const NX_ANGULAR_MODULE_FEDERATION_IMPORT_SELECTOR =
   'ImportDeclaration > StringLiteral[value=@nx/angular/module-federation], VariableStatement CallExpression:has(Identifier[name=require]) > StringLiteral[value=@nx/angular/module-federation]';
@@ -53,5 +55,15 @@ export default async function migrateWithMfImport(tree: Tree) {
     });
   }
 
+  if (projects.size !== 0) {
+    addDependenciesToPackageJson(
+      tree,
+      {},
+      {
+        '@nx/module-federation': nxVersion,
+      }
+    );
+  }
+
   await formatFiles(tree);
 }
diff --git a/packages/angular/src/migrations/update-20-3-0/ensure-nx-module-federation-package.ts b/packages/angular/src/migrations/update-20-3-0/ensure-nx-module-federation-package.ts
@@ -0,0 +1,30 @@
+import {
+  type Tree,
+  readProjectConfiguration,
+  addDependenciesToPackageJson,
+} from '@nx/devkit';
+import { forEachExecutorOptions } from '@nx/devkit/src/generators/executor-options-utils';
+import { nxVersion } from '../../utils/versions';
+
+export default async function ensureMfPackage(tree: Tree) {
+  const projects = new Set<string>();
+
+  forEachExecutorOptions(
+    tree,
+    '@nx/angular:module-federation-dev-server',
+    (options, project, target) => {
+      const projectConfig = readProjectConfiguration(tree, project);
+      projects.add(projectConfig.root);
+    }
+  );
+
+  if (projects.size !== 0) {
+    addDependenciesToPackageJson(
+      tree,
+      {},
+      {
+        '@nx/module-federation': nxVersion,
+      }
+    );
+  }
+}
diff --git a/packages/react/migrations.json b/packages/react/migrations.json
@@ -41,6 +41,12 @@
       "version": "20.2.0-beta.2",
       "description": "Update the withModuleFederation import use @nx/module-federation/webpack.",
       "factory": "./src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package"
+    },
+    "ensure-nx-module-federation-package": {
+      "cli": "nx",
+      "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"
     }
   },
   "packageJsonUpdates": {
diff --git a/packages/react/src/generators/host/host.ts b/packages/react/src/generators/host/host.ts
@@ -153,6 +153,7 @@ export async function hostGenerator(
     { '@module-federation/enhanced': moduleFederationEnhancedVersion },
     {
       '@nx/web': nxVersion,
+      '@nx/module-federation': nxVersion,
     }
   );
   tasks.push(installTask);
diff --git a/packages/react/src/generators/remote/remote.ts b/packages/react/src/generators/remote/remote.ts
@@ -226,6 +226,7 @@ export async function remoteGenerator(host: Tree, schema: Schema) {
     {
       '@module-federation/enhanced': moduleFederationEnhancedVersion,
       '@nx/web': nxVersion,
+      '@nx/module-federation': nxVersion,
     }
   );
   tasks.push(installTask);
diff --git a/packages/react/src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package.ts b/packages/react/src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package.ts
@@ -3,9 +3,11 @@ import {
   formatFiles,
   readProjectConfiguration,
   visitNotIgnoredFiles,
+  addDependenciesToPackageJson,
 } from '@nx/devkit';
 import { forEachExecutorOptions } from '@nx/devkit/src/generators/executor-options-utils';
 import { tsquery } from '@phenomnomnominal/tsquery';
+import { nxVersion } from '../../utils/versions';
 
 const NX_RSPACK_MODULE_FEDERATION_IMPORT_SELECTOR =
   'ImportDeclaration > StringLiteral[value=@nx/react/module-federation], VariableStatement CallExpression:has(Identifier[name=require]) > StringLiteral[value=@nx/react/module-federation]';
@@ -53,5 +55,15 @@ export default async function migrateWithMfImport(tree: Tree) {
     });
   }
 
+  if (projects.size !== 0) {
+    addDependenciesToPackageJson(
+      tree,
+      {},
+      {
+        '@nx/module-federation': nxVersion,
+      }
+    );
+  }
+
   await formatFiles(tree);
 }
diff --git a/packages/react/src/migrations/update-20-3-0/ensure-nx-module-federation-package.ts b/packages/react/src/migrations/update-20-3-0/ensure-nx-module-federation-package.ts
@@ -0,0 +1,30 @@
+import {
+  type Tree,
+  readProjectConfiguration,
+  addDependenciesToPackageJson,
+} from '@nx/devkit';
+import { forEachExecutorOptions } from '@nx/devkit/src/generators/executor-options-utils';
+import { nxVersion } from '../../utils/versions';
+
+export default async function ensureMfPackage(tree: Tree) {
+  const projects = new Set<string>();
+
+  forEachExecutorOptions(
+    tree,
+    '@nx/react:module-federation-dev-server',
+    (options, project, target) => {
+      const projectConfig = readProjectConfiguration(tree, project);
+      projects.add(projectConfig.root);
+    }
+  );
+
+  if (projects.size !== 0) {
+    addDependenciesToPackageJson(
+      tree,
+      {},
+      {
+        '@nx/module-federation': nxVersion,
+      }
+    );
+  }
+}
diff --git a/packages/rspack/migrations.json b/packages/rspack/migrations.json
@@ -5,6 +5,12 @@
       "version": "20.2.0-beta.3",
       "description": "Update the withModuleFederation import use @nx/module-federation/rspack.",
       "factory": "./src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package"
+    },
+    "ensure-nx-module-federation-package": {
+      "cli": "nx",
+      "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"
     }
   },
   "packageJsonUpdates": {
diff --git a/packages/rspack/src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package.ts b/packages/rspack/src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package.ts
@@ -3,9 +3,11 @@ import {
   formatFiles,
   readProjectConfiguration,
   visitNotIgnoredFiles,
+  addDependenciesToPackageJson,
 } from '@nx/devkit';
 import { forEachExecutorOptions } from '@nx/devkit/src/generators/executor-options-utils';
 import { tsquery } from '@phenomnomnominal/tsquery';
+import { nxVersion } from '../../utils/versions';
 
 const NX_RSPACK_MODULE_FEDERATION_IMPORT_SELECTOR =
   'ImportDeclaration > StringLiteral[value=@nx/rspack/module-federation], VariableStatement CallExpression:has(Identifier[name=require]) > StringLiteral[value=@nx/rspack/module-federation]';
@@ -53,5 +55,15 @@ export default async function migrateWithMfImport(tree: Tree) {
     });
   }
 
+  if (projects.size !== 0) {
+    addDependenciesToPackageJson(
+      tree,
+      {},
+      {
+        '@nx/module-federation': nxVersion,
+      }
+    );
+  }
+
   await formatFiles(tree);
 }
diff --git a/packages/rspack/src/migrations/update-20-3-0/ensure-nx-module-federation-package.ts b/packages/rspack/src/migrations/update-20-3-0/ensure-nx-module-federation-package.ts
@@ -0,0 +1,30 @@
+import {
+  type Tree,
+  readProjectConfiguration,
+  addDependenciesToPackageJson,
+} from '@nx/devkit';
+import { forEachExecutorOptions } from '@nx/devkit/src/generators/executor-options-utils';
+import { nxVersion } from '../../utils/versions';
+
+export default async function ensureMfPackage(tree: Tree) {
+  const projects = new Set<string>();
+
+  forEachExecutorOptions(
+    tree,
+    '@nx/rspack:module-federation-dev-server',
+    (options, project, target) => {
+      const projectConfig = readProjectConfiguration(tree, project);
+      projects.add(projectConfig.root);
+    }
+  );
+
+  if (projects.size !== 0) {
+    addDependenciesToPackageJson(
+      tree,
+      {},
+      {
+        '@nx/module-federation': nxVersion,
+      }
+    );
+  }
+}

Original file line number	Diff line number	Diff line change
`@@ -51,6 +51,7 @@ export async function setupMf(tree: Tree, rawOptions: Schema) {`
`51`	`51`	`{`
`52`	`52`	`'@nx/web': nxVersion,`
`53`	`53`	`'@nx/webpack': nxVersion,`
	`54`	`+ '@nx/module-federation': nxVersion,`
`54`	`55`	`}`
`55`	`56`	`);`
`56`	`57`	`}`
`@@ -82,6 +83,7 @@ export async function setupMf(tree: Tree, rawOptions: Schema) {`
`82`	`83`	`{`
`83`	`84`	`'@nx/webpack': nxVersion,`
`84`	`85`	`'@module-federation/enhanced': moduleFederationEnhancedVersion,`
	`86`	`+ '@nx/module-federation': nxVersion,`
`85`	`87`	`}`
`86`	`88`	`);`
`87`	`89`	`}`
Original file line number	Diff line number	Diff line change
`@@ -153,6 +153,7 @@ export async function hostGenerator(`
`153`	`153`	`{ '@module-federation/enhanced': moduleFederationEnhancedVersion },`
`154`	`154`	`{`
`155`	`155`	`'@nx/web': nxVersion,`
	`156`	`+ '@nx/module-federation': nxVersion,`
`156`	`157`	`}`
`157`	`158`	`);`
`158`	`159`	`tasks.push(installTask);`
Original file line number	Diff line number	Diff line change
`@@ -226,6 +226,7 @@ export async function remoteGenerator(host: Tree, schema: Schema) {`
`226`	`226`	`{`
`227`	`227`	`'@module-federation/enhanced': moduleFederationEnhancedVersion,`
`228`	`228`	`'@nx/web': nxVersion,`
	`229`	`+ '@nx/module-federation': nxVersion,`
`229`	`230`	`}`
`230`	`231`	`);`
`231`	`232`	`tasks.push(installTask);`