feat(module-federation): move withModuleFederation for rspack to new …

…package (#29045)

<!-- Please make sure you have read the submission guidelines before
posting an PR -->
<!--
https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr
-->

<!-- Please make sure that your commit message follows our format -->
<!-- Example: `fix(nx): must begin with lowercase` -->

<!-- If this is a particularly complex change or feature addition, you
can request a dedicated Nx release for this pull request branch. Mention
someone from the Nx team or the `@nrwl/nx-pipelines-reviewers` and they
will confirm if the PR warrants its own release for testing purposes,
and generate it for you if appropriate. -->

## Current Behavior
<!-- This is the behavior we have today -->
The `withModuleFederation` helper currently lives in the `@nx/rspack`
package.
With the goal of consolidating the module federation support into a
single package, this introduces a divergence in where module-federation
support lies


## Expected Behavior
<!-- This is the behavior we should expect with the changes in this PR
-->
Move `withModuleFederation` helper for angular into the
`@nx/module-federation` package, exposed via
`@nx/module-federation/rspack`.
Adds a migration to migrate existing projects to use the new package

## Related Issue(s)
<!-- Please link the issue being fixed so it gets closed when this is
merged. -->

Fixes #

packages/module-federation/rspack.ts

@@ -0,0 +1,2 @@
+export * from './src/with-module-federation/rspack/with-module-federation';
+export * from './src/with-module-federation/rspack/with-module-federation-ssr';

packages/rspack/src/utils/module-federation/with-module-federation/utils.ts → packages/module-federation/src/with-module-federation/rspack/utils.ts

@@ -13,7 +13,7 @@ import {
   mapRemotes,
   mapRemotesForSSR,
   getDependentPackagesForProject,
-} from '@nx/module-federation';
+} from '../../utils';
 
 export function getFunctionDeterminateRemoteUrl(isServer = false) {
   const target = 'serve';

packages/rspack/src/utils/module-federation/with-module-federation/with-module-federation-ssr.ts → packages/module-federation/src/with-module-federation/rspack/with-module-federation-ssr.ts

@@ -2,9 +2,8 @@ import { DefinePlugin } from '@rspack/core';
 import {
   ModuleFederationConfig,
   NxModuleFederationConfigOverride,
-} from '@nx/module-federation';
+} from '../../utils';
 import { getModuleFederationConfig } from './utils';
-import { NxRspackExecutionContext } from '../../config';
 
 export async function withModuleFederationForSSR(
   options: ModuleFederationConfig,
@@ -19,7 +18,7 @@ export async function withModuleFederationForSSR(
       isServer: true,
     });
 
-  return (config, { context }: NxRspackExecutionContext) => {
+  return (config, { context }) => {
     config.target = 'async-node';
     config.output.uniqueName = options.name;
     config.output.library = {

packages/rspack/src/utils/module-federation/with-module-federation/with-module-federation.ts → packages/module-federation/src/with-module-federation/rspack/with-module-federation.ts

@@ -4,9 +4,9 @@ import { DefinePlugin } from '@rspack/core';
 import {
   ModuleFederationConfig,
   NxModuleFederationConfigOverride,
-} from '@nx/module-federation';
+} from '../../utils';
 import { getModuleFederationConfig } from './utils';
-import { NxRspackExecutionContext } from '../../config';
+import { type ExecutorContext } from '@nx/devkit';
 
 const isVarOrWindow = (libType?: string) =>
   libType === 'var' || libType === 'window';
@@ -31,7 +31,7 @@ export async function withModuleFederation(
 
   return function makeConfig(
     config: Configuration,
-    { context }: NxRspackExecutionContext
+    { context }
   ): Configuration {
     config.output.uniqueName = options.name;
     config.output.publicPath = 'auto';

packages/react/src/generators/host/__snapshots__/host.rspack.spec.ts.snap

@@ -2,7 +2,7 @@
 
 exports[`hostGenerator bundler=rspack should generate host files and configs for SSR 1`] = `
 "const { composePlugins, withNx, withReact } = require('@nx/rspack');
-const { withModuleFederationForSSR } = require('@nx/rspack/module-federation');
+const { withModuleFederationForSSR } = require('@nx/module-federation/rspack');
 
 const baseConfig = require('./module-federation.config');
 
@@ -44,7 +44,7 @@ module.exports = moduleFederationConfig;
 
 exports[`hostGenerator bundler=rspack should generate host files and configs for SSR when --typescriptConfiguration=true 1`] = `
 "import { composePlugins, withNx, withReact } from '@nx/rspack';
-import { withModuleFederationForSSR } from '@nx/rspack/module-federation';
+import { withModuleFederationForSSR } from '@nx/module-federation/rspack';
 
 import baseConfig from './module-federation.config';
 
@@ -83,7 +83,7 @@ export default config;
 
 exports[`hostGenerator bundler=rspack should generate host files and configs when --typescriptConfiguration=false 1`] = `
 "const { composePlugins, withNx, withReact } = require('@nx/rspack');
-const { withModuleFederation } = require('@nx/rspack/module-federation');
+const { withModuleFederation } = require('@nx/module-federation/rspack');
 
 const baseConfig = require('./module-federation.config');
 
@@ -130,7 +130,7 @@ module.exports = {
 
 exports[`hostGenerator bundler=rspack should generate host files and configs when --typescriptConfiguration=true 1`] = `
 "import {composePlugins, withNx, withReact} from '@nx/rspack';
-import { withModuleFederation } from '@nx/rspack/module-federation';
+import { withModuleFederation } from '@nx/module-federation/rspack';
 import { ModuleFederationConfig } from '@nx/module-federation';
 
 import baseConfig from './module-federation.config';

packages/react/src/generators/host/files/rspack-module-federation-ssr-ts/rspack.server.config.ts__tmpl__

@@ -1,5 +1,5 @@
 import {composePlugins, withNx, withReact} from '@nx/rspack';
-import {withModuleFederationForSSR} from '@nx/rspack/module-federation';
+import {withModuleFederationForSSR} from '@nx/module-federation/rspack';
 
 import baseConfig from './module-federation.config';
 

packages/react/src/generators/host/files/rspack-module-federation-ssr/rspack.server.config.js__tmpl__

@@ -1,5 +1,5 @@
 const {composePlugins, withNx, withReact} = require('@nx/rspack');
-const {withModuleFederationForSSR} = require('@nx/rspack/module-federation');
+const {withModuleFederationForSSR} = require('@nx/module-federation/rspack');
 
 const baseConfig = require('./module-federation.config');
 

packages/react/src/generators/host/files/rspack-module-federation-ts/rspack.config.prod.ts__tmpl__

@@ -1,5 +1,5 @@
 import { composePlugins, withNx, withReact } from '@nx/rspack';
-import { withModuleFederation } from '@nx/rspack/module-federation';
+import { withModuleFederation } from '@nx/module-federation/rspack';
 import { ModuleFederationConfig } from '@nx/module-federation';
 
 import baseConfig from './module-federation.config';

packages/react/src/generators/host/files/rspack-module-federation-ts/rspack.config.ts__tmpl__

@@ -1,5 +1,5 @@
 import {composePlugins, withNx, withReact} from '@nx/rspack';
-import { withModuleFederation } from '@nx/rspack/module-federation';
+import { withModuleFederation } from '@nx/module-federation/rspack';
 import { ModuleFederationConfig } from '@nx/module-federation';
 
 import baseConfig from './module-federation.config';

packages/react/src/generators/host/files/rspack-module-federation/rspack.config.js__tmpl__

@@ -1,5 +1,5 @@
 const { composePlugins, withNx, withReact } = require('@nx/rspack');
-const { withModuleFederation } = require('@nx/rspack/module-federation');
+const { withModuleFederation } = require('@nx/module-federation/rspack');
 
 const baseConfig = require('./module-federation.config');
 

packages/react/src/generators/host/files/rspack-module-federation/rspack.config.prod.js__tmpl__

@@ -1,5 +1,5 @@
 const { composePlugins, withNx, withReact } = require('@nx/rspack');
-const { withModuleFederation } = require('@nx/rspack/module-federation');
+const { withModuleFederation } = require('@nx/module-federation/rspack');
 
 const baseConfig = require('./module-federation.config');
 

packages/react/src/generators/remote/__snapshots__/remote.rspack.spec.ts.snap

@@ -2,7 +2,7 @@
 
 exports[`remote generator bundler=rspack should create the remote with the correct config files 1`] = `
 "const { composePlugins, withNx, withReact } = require('@nx/rspack');
-const { withModuleFederation } = require('@nx/rspack/module-federation');
+const { withModuleFederation } = require('@nx/module-federation/rspack');
 
 const baseConfig = require('./module-federation.config');
 
@@ -37,7 +37,7 @@ module.exports = {
 
 exports[`remote generator bundler=rspack should create the remote with the correct config files when --js=true 1`] = `
 "const { composePlugins, withNx, withReact } = require('@nx/rspack');
-const { withModuleFederation } = require('@nx/rspack/module-federation');
+const { withModuleFederation } = require('@nx/module-federation/rspack');
 
 const baseConfig = require('./module-federation.config');
 
@@ -72,7 +72,7 @@ module.exports = {
 
 exports[`remote generator bundler=rspack should create the remote with the correct config files when --typescriptConfiguration=true 1`] = `
 "import { composePlugins, withNx, withReact } from '@nx/rspack';
-import { withModuleFederation } from '@nx/rspack/module-federation';
+import { withModuleFederation } from '@nx/module-federation/rspack';
 
 import baseConfig from './module-federation.config';
 
@@ -118,7 +118,7 @@ export default config;
 
 exports[`remote generator bundler=rspack should generate correct remote with config files when using --ssr 1`] = `
 "const {composePlugins, withNx, withReact} = require('@nx/rspack');
-const {withModuleFederationForSSR} = require('@nx/rspack/module-federation');
+const {withModuleFederationForSSR} = require('@nx/module-federation/rspack');
 
 const baseConfig = require("./module-federation.server.config");
 
@@ -151,7 +151,7 @@ module.exports = {
 
 exports[`remote generator bundler=rspack should generate correct remote with config files when using --ssr and --typescriptConfiguration=true 1`] = `
 "import { composePlugins, withNx, withReact } from '@nx/rspack';
-import { withModuleFederationForSSR } from '@nx/rspack/module-federation';
+import { withModuleFederationForSSR } from '@nx/module-federation/rspack';
 
 import baseConfig from './module-federation.server.config';
 

packages/react/src/generators/remote/files/rspack-module-federation-ssr-ts/rspack.server.config.ts__tmpl__

@@ -1,5 +1,5 @@
 import {composePlugins, withNx, withReact} from '@nx/rspack';
-import {withModuleFederationForSSR} from '@nx/rspack/module-federation';
+import {withModuleFederationForSSR} from '@nx/module-federation/rspack';
 
 import baseConfig from "./module-federation.server.config";
 

packages/react/src/generators/remote/files/rspack-module-federation-ssr/rspack.server.config.js__tmpl__

@@ -1,5 +1,5 @@
 const {composePlugins, withNx, withReact} = require('@nx/rspack');
-const {withModuleFederationForSSR} = require('@nx/rspack/module-federation');
+const {withModuleFederationForSSR} = require('@nx/module-federation/rspack');
 
 const baseConfig = require("./module-federation.server.config");
 

packages/react/src/generators/remote/files/rspack-module-federation-ts/rspack.config.ts__tmpl__

@@ -1,5 +1,5 @@
 import {composePlugins, withNx, withReact} from '@nx/rspack';
-import {withModuleFederation} from '@nx/rspack/module-federation';
+import {withModuleFederation} from '@nx/module-federation/rspack';
 
 import baseConfig from './module-federation.config';
 

packages/react/src/generators/remote/files/rspack-module-federation/rspack.config.js__tmpl__

@@ -1,5 +1,5 @@
 const { composePlugins, withNx, withReact } = require('@nx/rspack');
-const { withModuleFederation } = require('@nx/rspack/module-federation');
+const { withModuleFederation } = require('@nx/module-federation/rspack');
 
 const baseConfig = require('./module-federation.config');
 

packages/react/src/migrations/update-20-2-0/migrate-with-mf-import-to-new-package.ts

@@ -7,7 +7,7 @@ import {
 import { forEachExecutorOptions } from '@nx/devkit/src/generators/executor-options-utils';
 import { tsquery } from '@phenomnomnominal/tsquery';
 
-const NX_ANGULAR_MODULE_FEDERATION_IMPORT_SELECTOR =
+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]';
 const NEW_IMPORT_PATH = `'@nx/module-federation/webpack'`;
 
@@ -36,7 +36,7 @@ export default async function migrateWithMfImport(tree: Tree) {
       const ast = tsquery.ast(contents);
       const importNodes = tsquery(
         ast,
-        NX_ANGULAR_MODULE_FEDERATION_IMPORT_SELECTOR
+        NX_RSPACK_MODULE_FEDERATION_IMPORT_SELECTOR
       );
 
       if (importNodes.length === 0) {

packages/rspack/migrations.json

@@ -1,5 +1,12 @@
 {
-  "generators": {},
+  "generators": {
+    "update-20-2-0-update-with-module-federation-import": {
+      "cli": "nx",
+      "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"
+    }
+  },
   "packageJsonUpdates": {
     "18.1.0": {
       "version": "18.1.0-beta.0",

packages/rspack/module-federation.ts

@@ -1 +1,7 @@
-export * from './src/utils/module-federation/public-api';
+/**
+ * @deprecated Use `@nx/module-federation/rspack` instead. This will be removed in Nx v22.
+ */
+export {
+  withModuleFederation,
+  withModuleFederationForSSR,
+} from '@nx/module-federation/rspack';

packages/rspack/src/generators/convert-webpack/convert-webpack.spec.ts

@@ -140,7 +140,7 @@ describe('Convert webpack', () => {
 
     expect(tree.exists('demo/rspack.config.ts')).toBeTruthy();
     expect(tree.read('demo/rspack.config.ts', 'utf-8')).toMatchInlineSnapshot(`
-      "import { withModuleFederation } from '@nx/rspack/module-federation';
+      "import { withModuleFederation } from '@nx/module-federation/rspack';
       import { withReact } from '@nx/rspack';
       import { withNx } from '@nx/rspack';
       import { composePlugins } from '@nx/rspack';
@@ -242,7 +242,7 @@ describe('Convert webpack', () => {
     expect(tree.exists('remote1/rspack.config.ts')).toBeTruthy();
     expect(tree.read('remote1/rspack.config.ts', 'utf-8'))
       .toMatchInlineSnapshot(`
-      "import { withModuleFederation } from '@nx/rspack/module-federation';
+      "import { withModuleFederation } from '@nx/module-federation/rspack';
       import { withReact } from '@nx/rspack';
       import { withNx } from '@nx/rspack';
       import { composePlugins } from '@nx/rspack';
@@ -348,7 +348,7 @@ describe('Convert webpack', () => {
     expect(tree.exists('remote2/rspack.config.ts')).toBeTruthy();
     expect(tree.read('remote2/rspack.config.ts', 'utf-8'))
       .toMatchInlineSnapshot(`
-      "import { withModuleFederation } from '@nx/rspack/module-federation';
+      "import { withModuleFederation } from '@nx/module-federation/rspack';
       import { withReact } from '@nx/rspack';
       import { withNx } from '@nx/rspack';
       import { composePlugins } from '@nx/rspack';

packages/rspack/src/generators/convert-webpack/lib/transform-cjs.ts

@@ -172,7 +172,7 @@ function transformModuleFederationConfig(
     endIndex++;
   }
 
-  const newContents = `const { ModuleFederationConfig } = require('@nx/rspack/module-federation');
+  const newContents = `const { ModuleFederationConfig } = require('@nx/module-federation');
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
 
   tree.write(configPath, newContents);
@@ -205,7 +205,7 @@ function transformWithModuleFederation(
     endIndex++;
   }
 
-  const newContents = `const { withModuleFederation } = require('@nx/rspack/module-federation');
+  const newContents = `const { withModuleFederation } = require('@nx/module-federation/rspack');
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
 
   tree.write(configPath, newContents);
@@ -238,7 +238,7 @@ function transformWithModuleFederationSSR(
     endIndex++;
   }
 
-  const newContents = `const { withModuleFederationForSSR } = require('@nx/rspack/module-federation');
+  const newContents = `const { withModuleFederationForSSR } = require('@nx/module-federation/rspack');
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
 
   tree.write(configPath, newContents);

packages/rspack/src/generators/convert-webpack/lib/transform-esm.ts

@@ -172,7 +172,7 @@ function transformWithModuleFederation(
     endIndex++;
   }
 
-  const newContents = `import { withModuleFederation } from '@nx/rspack/module-federation';
+  const newContents = `import { withModuleFederation } from '@nx/module-federation/rspack';
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
 
   tree.write(configPath, newContents);
@@ -205,7 +205,7 @@ function transformModuleFederationConfig(
     endIndex++;
   }
 
-  const newContents = `import { ModuleFederationConfig } from '@nx/rspack/module-federation';
+  const newContents = `import { ModuleFederationConfig } from '@nx/module-federation';
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
 
   tree.write(configPath, newContents);
@@ -238,7 +238,7 @@ function transformWithModuleFederationSSR(
     endIndex++;
   }
 
-  const newContents = `import { withModuleFederationForSSR } from '@nx/rspack/module-federation';
+  const newContents = `import { withModuleFederationForSSR } from '@nx/module-federation/rspack';
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
 
   tree.write(configPath, newContents);