@nx/rspack 21.2.1 → 21.2.2

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nx/rspack",
   "description": "The Nx Plugin for Rspack contains executors and generators that support building applications using Rspack.",
-  "version": "21.2.1",
+  "version": "21.2.2",
   "type": "commonjs",
   "repository": {
     "type": "git",
@@ -24,10 +24,10 @@
   "generators": "./generators.json",
   "executors": "./executors.json",
   "dependencies": {
-    "@nx/js": "21.2.1",
-    "@nx/devkit": "21.2.1",
-    "@nx/web": "21.2.1",
-    "@nx/module-federation": "21.2.1",
+    "@nx/js": "21.2.2",
+    "@nx/devkit": "21.2.2",
+    "@nx/web": "21.2.2",
+    "@nx/module-federation": "21.2.2",
     "@phenomnomnominal/tsquery": "~5.0.1",
     "@rspack/core": "^1.3.8",
     "@rspack/dev-server": "^1.1.1",
@@ -57,7 +57,7 @@
     "webpack-node-externals": "^3.0.0"
   },
   "peerDependencies": {
-    "@module-federation/enhanced": "^0.9.0",
+    "@module-federation/enhanced": "^0.15.0",
     "@module-federation/node": "^2.6.26"
   },
   "nx-migrations": {

package/src/generators/convert-webpack/lib/transform-cjs.js

@@ -3,18 +3,25 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.transformCjsConfigFile = transformCjsConfigFile;
 const tsquery_1 = require("@phenomnomnominal/tsquery");
 function transformCjsConfigFile(tree, configPath) {
+    const configContents = tree.read(configPath, 'utf-8');
+    const usesJsExtensions = detectJsExtensions(configContents);
     ['@nx', '@nrwl'].forEach((scope) => {
         transformComposePlugins(tree, configPath, scope);
         transformWithNx(tree, configPath, scope);
         transformWithWeb(tree, configPath, scope);
         transformWithReact(tree, configPath, scope);
         transformModuleFederationConfig(tree, configPath, scope);
-        transformWithModuleFederation(tree, configPath, scope);
-        transformWithModuleFederationSSR(tree, configPath, scope);
+        transformWithModuleFederation(tree, configPath, scope, usesJsExtensions);
+        transformWithModuleFederationSSR(tree, configPath, scope, usesJsExtensions);
     });
     // Add useLegacyHtmlPlugin: true to withWeb() calls
     transformWithWebCalls(tree, configPath);
 }
+function detectJsExtensions(configContents) {
+    // Check if any require calls use .js extensions
+    const requireWithJsExtensionRegex = /require\s*\(\s*['"]@nx\/[^'"]*\.js['"]\s*\)/;
+    return requireWithJsExtensionRegex.test(configContents);
+}
 function transformWithWebCalls(tree, configPath) {
     const configContents = tree.read(configPath, 'utf-8');
     const ast = tsquery_1.tsquery.ast(configContents);
@@ -204,10 +211,10 @@ function transformModuleFederationConfig(tree, configPath, scope) {
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
     tree.write(configPath, newContents);
 }
-function transformWithModuleFederation(tree, configPath, scope) {
+function transformWithModuleFederation(tree, configPath, scope, usesJsExtensions) {
     const configContents = tree.read(configPath, 'utf-8');
     const ast = tsquery_1.tsquery.ast(configContents);
-    const HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT = `VariableDeclaration:has(Identifier[name=withModuleFederation]) > CallExpression:has(Identifier[name=require]) StringLiteral[value=${scope}/module-federation/webpack]`;
+    const HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT = `VariableDeclaration:has(Identifier[name=withModuleFederation]) > CallExpression:has(Identifier[name=require]) StringLiteral[value="${scope}/module-federation/webpack${usesJsExtensions ? '.js' : ''}"]`;
     const nodes = (0, tsquery_1.tsquery)(ast, HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT);
     if (nodes.length === 0) {
         return;
@@ -222,14 +229,17 @@ function transformWithModuleFederation(tree, configPath, scope) {
     if (configContents.charAt(endIndex) === ',') {
         endIndex++;
     }
-    const newContents = `const { withModuleFederation } = require('@nx/module-federation/rspack');
+    const rspackImport = usesJsExtensions
+        ? '@nx/module-federation/rspack.js'
+        : '@nx/module-federation/rspack';
+    const newContents = `const { withModuleFederation } = require('${rspackImport}');
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
     tree.write(configPath, newContents);
 }
-function transformWithModuleFederationSSR(tree, configPath, scope) {
+function transformWithModuleFederationSSR(tree, configPath, scope, usesJsExtensions) {
     const configContents = tree.read(configPath, 'utf-8');
     const ast = tsquery_1.tsquery.ast(configContents);
-    const HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT = `VariableDeclaration:has(Identifier[name=withModuleFederationForSSR]) > CallExpression:has(Identifier[name=require]) StringLiteral[value=${scope}/module-federation/webpack]`;
+    const HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT = `VariableDeclaration:has(Identifier[name=withModuleFederationForSSR]) > CallExpression:has(Identifier[name=require]) StringLiteral[value="${scope}/module-federation/webpack${usesJsExtensions ? '.js' : ''}"]`;
     const nodes = (0, tsquery_1.tsquery)(ast, HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT);
     if (nodes.length === 0) {
         return;
@@ -244,7 +254,10 @@ function transformWithModuleFederationSSR(tree, configPath, scope) {
     if (configContents.charAt(endIndex) === ',') {
         endIndex++;
     }
-    const newContents = `const { withModuleFederationForSSR } = require('@nx/module-federation/rspack');
+    const rspackImport = usesJsExtensions
+        ? '@nx/module-federation/rspack.js'
+        : '@nx/module-federation/rspack';
+    const newContents = `const { withModuleFederationForSSR } = require('${rspackImport}');
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
     tree.write(configPath, newContents);
 }

package/src/generators/convert-webpack/lib/transform-esm.js

@@ -3,18 +3,25 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.transformEsmConfigFile = transformEsmConfigFile;
 const tsquery_1 = require("@phenomnomnominal/tsquery");
 function transformEsmConfigFile(tree, configPath) {
+    const configContents = tree.read(configPath, 'utf-8');
+    const usesJsExtensions = detectJsExtensions(configContents);
     ['@nx', '@nrwl'].forEach((scope) => {
         transformComposePlugins(tree, configPath, scope);
         transformWithNx(tree, configPath, scope);
         transformWithWeb(tree, configPath, scope);
         transformWithReact(tree, configPath, scope);
         transformModuleFederationConfig(tree, configPath, scope);
-        transformWithModuleFederation(tree, configPath, scope);
-        transformWithModuleFederationSSR(tree, configPath, scope);
+        transformWithModuleFederation(tree, configPath, scope, usesJsExtensions);
+        transformWithModuleFederationSSR(tree, configPath, scope, usesJsExtensions);
     });
     // Add useLegacyHtmlPlugin: true to withWeb() calls
     transformWithWebCalls(tree, configPath);
 }
+function detectJsExtensions(configContents) {
+    // Check if any imports use .js extensions
+    const importWithJsExtensionRegex = /from\s+['"]@nx\/[^'"]*\.js['"]/;
+    return importWithJsExtensionRegex.test(configContents);
+}
 function transformWithWebCalls(tree, configPath) {
     const configContents = tree.read(configPath, 'utf-8');
     const ast = tsquery_1.tsquery.ast(configContents);
@@ -182,10 +189,10 @@ function transformWithReact(tree, configPath, scope) {
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
     tree.write(configPath, newContents);
 }
-function transformWithModuleFederation(tree, configPath, scope) {
+function transformWithModuleFederation(tree, configPath, scope, usesJsExtension) {
     const configContents = tree.read(configPath, 'utf-8');
     const ast = tsquery_1.tsquery.ast(configContents);
-    const HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT = `ImportDeclaration:has(Identifier[name=withModuleFederation]) > StringLiteral[value=${scope}/module-federation/webpack]`;
+    const HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT = `ImportDeclaration:has(Identifier[name=withModuleFederation]) > StringLiteral[value="${scope}/module-federation/webpack${usesJsExtension ? '.js' : ''}"]`;
     const nodes = (0, tsquery_1.tsquery)(ast, HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT);
     if (nodes.length === 0) {
         return;
@@ -200,7 +207,10 @@ function transformWithModuleFederation(tree, configPath, scope) {
     if (configContents.charAt(endIndex) === ',') {
         endIndex++;
     }
-    const newContents = `import { withModuleFederation } from '@nx/module-federation/rspack';
+    const moduleFederationImport = usesJsExtension
+        ? '@nx/module-federation/rspack.js'
+        : '@nx/module-federation/rspack';
+    const newContents = `import { withModuleFederation } from '${moduleFederationImport}';
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
     tree.write(configPath, newContents);
 }
@@ -226,10 +236,10 @@ function transformModuleFederationConfig(tree, configPath, scope) {
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
     tree.write(configPath, newContents);
 }
-function transformWithModuleFederationSSR(tree, configPath, scope) {
+function transformWithModuleFederationSSR(tree, configPath, scope, usesJsExtensions) {
     const configContents = tree.read(configPath, 'utf-8');
     const ast = tsquery_1.tsquery.ast(configContents);
-    const HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT = `ImportDeclaration:has(Identifier[name=withModuleFederationForSSR]) > StringLiteral[value=${scope}/module-federation/webpack]`;
+    const HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT = `ImportDeclaration:has(Identifier[name=withModuleFederationForSSR]) > StringLiteral[value="${scope}/module-federation/webpack${usesJsExtensions ? '.js' : ''}"]`;
     const nodes = (0, tsquery_1.tsquery)(ast, HAS_WITH_MODULE_FEDERATION_FROM_NX_REACT);
     if (nodes.length === 0) {
         return;
@@ -244,7 +254,10 @@ function transformWithModuleFederationSSR(tree, configPath, scope) {
     if (configContents.charAt(endIndex) === ',') {
         endIndex++;
     }
-    const newContents = `import { withModuleFederationForSSR } from '@nx/module-federation/rspack';
+    const rspackImport = usesJsExtensions
+        ? '@nx/module-federation/rspack.js'
+        : '@nx/module-federation/rspack';
+    const newContents = `import { withModuleFederationForSSR } from '${rspackImport}';
   ${configContents.slice(0, startIndex)}${configContents.slice(endIndex)}`;
     tree.write(configPath, newContents);
 }

package/src/plugins/utils/apply-base-config.js

@@ -76,11 +76,28 @@ function applyNxIndependentConfig(options, config) {
         options.sourceMap === true ? 'source-map' : options.sourceMap;
     config.output = {
         ...(config.output ?? {}),
-        libraryTarget: options.target === 'node'
-            ? 'commonjs'
-            : options.target === 'async-node'
-                ? 'commonjs-module'
-                : undefined,
+        libraryTarget: (() => {
+            const existingOutputConfig = config.output;
+            const existingLibraryTarget = existingOutputConfig?.libraryTarget;
+            const existingLibraryType = typeof existingOutputConfig?.library === 'object' &&
+                'type' in existingOutputConfig?.library
+                ? existingOutputConfig?.library?.type
+                : undefined;
+            // If user is using modern library.type, don't set the deprecated libraryTarget
+            if (existingLibraryType !== undefined) {
+                return undefined;
+            }
+            // If user has set libraryTarget explicitly, use it
+            if (existingLibraryTarget !== undefined) {
+                return existingLibraryTarget;
+            }
+            // Set defaults based on target when user hasn't configured anything
+            if (options.target === 'node')
+                return 'commonjs';
+            if (options.target === 'async-node')
+                return 'commonjs-module';
+            return undefined;
+        })(),
         path: config.output?.path ??
             (options.outputPath
                 ? // If path is relative, it is relative from project root (aka cwd).