@nx/react 23.3.0-canary.20260915-071d621 → 23.3.0-canary.20260917-ea5c01d

package/dist/src/generators/_utils/mf-dependencies.js

@@ -72,6 +72,8 @@ function bundlerDeps(bundler) {
                     '@rspack/cli': mfVersions.rspackCliVersion,
                     '@rspack/core': mfVersions.rspackCoreVersion,
                     '@rspack/dev-server': mfVersions.rspackDevServerVersion,
+                    '@rspack/plugin-react-refresh': mfVersions.rspackPluginReactRefreshVersion,
+                    'react-refresh': mfVersions.reactRefreshVersion,
                 },
             };
     }

package/dist/src/generators/_utils/mf-versions.d.ts

@@ -8,4 +8,6 @@ export declare const rsbuildPluginReactVersion = "^1.3.0";
 export declare const moduleFederationRsbuildPluginVersion = "^2.5.0";
 export declare const rspackCoreVersion = "^2.0.3";
 export declare const rspackCliVersion = "^2.0.3";
+export declare const rspackPluginReactRefreshVersion = "^2.0.0";
+export declare const reactRefreshVersion = "~0.14.0";
 export declare const rspackDevServerVersion = "2.0.1";

package/dist/src/generators/_utils/mf-versions.js

@@ -3,7 +3,7 @@
 // versions (react, react-dom, @types/*, typescript) are owned by @nx/react
 // (../../utils/versions) and @nx/js so each dep has a single source of truth.
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.rspackDevServerVersion = exports.rspackCliVersion = exports.rspackCoreVersion = exports.moduleFederationRsbuildPluginVersion = exports.rsbuildPluginReactVersion = exports.rsbuildCoreVersion = exports.vitejsPluginReactVersion = exports.viteVersion = exports.moduleFederationRuntimeVersion = exports.moduleFederationVitePluginVersion = exports.moduleFederationEnhancedVersion = void 0;
+exports.rspackDevServerVersion = exports.reactRefreshVersion = exports.rspackPluginReactRefreshVersion = exports.rspackCliVersion = exports.rspackCoreVersion = exports.moduleFederationRsbuildPluginVersion = exports.rsbuildPluginReactVersion = exports.rsbuildCoreVersion = exports.vitejsPluginReactVersion = exports.viteVersion = exports.moduleFederationRuntimeVersion = exports.moduleFederationVitePluginVersion = exports.moduleFederationEnhancedVersion = void 0;
 // Module Federation runtime packages. Keep `runtime` on the same major as
 // `enhanced` / the `vite` plugin (both pull runtime 2.4.x). A 0.x runtime in
 // the consumer would mismatch the 2.x runtime baked into the providers.
@@ -23,6 +23,9 @@ exports.moduleFederationRsbuildPluginVersion = '^2.5.0';
 // Rspack stack.
 exports.rspackCoreVersion = '^2.0.3';
 exports.rspackCliVersion = '^2.0.3';
+// @rspack/plugin-react-refresh 2.x peers react-refresh >=0.10 <1.
+exports.rspackPluginReactRefreshVersion = '^2.0.0';
+exports.reactRefreshVersion = '~0.14.0';
 // Pinned (no ^) to dodge the broken 2.0.2 publish, which ships no dist/ so
 // @rspack/cli can't load it for `rspack serve`. Re-float to ^ once upstream
 // republishes a fixed 2.0.3+.

package/dist/src/generators/consumer/files/rspack/package.json__tmpl__

@@ -16,8 +16,10 @@
     "@rspack/cli": "<%= versions.rspackCliVersion %>",
     "@rspack/core": "<%= versions.rspackCoreVersion %>",
     "@rspack/dev-server": "<%= versions.rspackDevServerVersion %>",
+    "@rspack/plugin-react-refresh": "<%= versions.rspackPluginReactRefreshVersion %>",
     "@types/react": "<%= versions.typesReactVersion %>",
     "@types/react-dom": "<%= versions.typesReactDomVersion %>",
+    "react-refresh": "<%= versions.reactRefreshVersion %>",
     "typescript": "<%= versions.typescriptVersion %>"
   }
 }

package/dist/src/generators/consumer/files/rspack/rspack.config.ts__tmpl__

@@ -1,6 +1,7 @@
 import { defineConfig } from '@rspack/cli';
 import { rspack } from '@rspack/core';
 import { ModuleFederationPlugin } from '@module-federation/enhanced/rspack';
+import { ReactRefreshRspackPlugin } from '@rspack/plugin-react-refresh';
 import * as path from 'node:path';
 import { fileURLToPath } from 'node:url';
 
@@ -38,7 +39,9 @@ export default defineConfig((_env, argv) => {
             options: {
               jsc: {
                 parser: { syntax: 'typescript', tsx: true },
-                transform: { react: { runtime: 'automatic', development: isDev } },
+                transform: {
+                  react: { runtime: 'automatic', development: isDev, refresh: isDev },
+                },
               },
               env: { targets: 'Chrome >= 87, Firefox >= 78, Edge >= 88, Safari >= 14' },
             },
@@ -47,6 +50,7 @@ export default defineConfig((_env, argv) => {
       ],
     },
     plugins: [
+      isDev && new ReactRefreshRspackPlugin(),
       new rspack.HtmlRspackPlugin({ template: './index.html' }),
       new ModuleFederationPlugin({
         name: NAME,
@@ -54,6 +58,6 @@ export default defineConfig((_env, argv) => {
         // src/mf.ts at module load time.
         shared: ['react', 'react-dom'],
       }),
-    ],
+    ].filter(Boolean),
   };
 });

package/dist/src/generators/cypress-component-configuration/cypress-component-configuration.js

@@ -26,13 +26,7 @@ async function cypressComponentConfigGeneratorInternal(tree, options) {
         nxJson.useInferencePlugins !== false;
     options.addPlugin ??= addPlugin;
     const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.project);
-    const installTask = await baseCyCtConfig(tree, {
-        project: options.project,
-        skipFormat: true,
-        jsx: true,
-        addPlugin: options.addPlugin,
-    });
-    const found = await (0, ct_utils_1.configureCypressCT)(tree, {
+    const { found, bundler } = await (0, ct_utils_1.resolveCypressCTTarget)(tree, {
         project: options.project,
         buildTarget: options.buildTarget,
         bundler: options.bundler,
@@ -41,6 +35,14 @@ async function cypressComponentConfigGeneratorInternal(tree, options) {
             '@nx/vite:build',
         ]),
     });
+    const installTask = await baseCyCtConfig(tree, {
+        project: options.project,
+        skipFormat: true,
+        jsx: true,
+        addPlugin: options.addPlugin,
+        bundler,
+    });
+    await (0, ct_utils_1.configureCypressCT)(tree, { project: options.project, found, bundler });
     await (0, add_files_1.addFiles)(tree, projectConfig, options, found);
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(tree);

package/dist/src/generators/host/host.js

@@ -143,6 +143,11 @@ async function hostGenerator(host, schema) {
             : {}),
     }, undefined, true);
     tasks.push(installTask);
+    // The TS config templates use extensionless relative imports and
+    // `__dirname`, which Node's native type stripping cannot load.
+    if (options.typescriptConfiguration) {
+        tasks.push((0, internal_3.addSwcRegisterDependencies)(host));
+    }
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(host);
     }

package/dist/src/generators/provider/files/rspack/package.json__tmpl__

@@ -15,8 +15,10 @@
     "@rspack/cli": "<%= versions.rspackCliVersion %>",
     "@rspack/core": "<%= versions.rspackCoreVersion %>",
     "@rspack/dev-server": "<%= versions.rspackDevServerVersion %>",
+    "@rspack/plugin-react-refresh": "<%= versions.rspackPluginReactRefreshVersion %>",
     "@types/react": "<%= versions.typesReactVersion %>",
     "@types/react-dom": "<%= versions.typesReactDomVersion %>",
+    "react-refresh": "<%= versions.reactRefreshVersion %>",
     "typescript": "<%= versions.typescriptVersion %>"
   }
 }

package/dist/src/generators/provider/files/rspack/rspack.config.ts__tmpl__

@@ -1,6 +1,7 @@
 import { defineConfig } from '@rspack/cli';
 import { rspack } from '@rspack/core';
 import { ModuleFederationPlugin } from '@module-federation/enhanced/rspack';
+import { ReactRefreshRspackPlugin } from '@rspack/plugin-react-refresh';
 import * as path from 'node:path';
 import { fileURLToPath } from 'node:url';
 
@@ -43,7 +44,9 @@ export default defineConfig((_env, argv) => {
             options: {
               jsc: {
                 parser: { syntax: 'typescript', tsx: true },
-                transform: { react: { runtime: 'automatic', development: isDev } },
+                transform: {
+                  react: { runtime: 'automatic', development: isDev, refresh: isDev },
+                },
               },
               env: { targets: 'Chrome >= 87, Firefox >= 78, Edge >= 88, Safari >= 14' },
             },
@@ -52,6 +55,7 @@ export default defineConfig((_env, argv) => {
       ],
     },
     plugins: [
+      isDev && new ReactRefreshRspackPlugin(),
       // excludeChunks is REQUIRED on a provider: without it the federation
       // remoteEntry chunk gets injected into the standalone HTML and breaks
       // direct serves.
@@ -64,6 +68,6 @@ export default defineConfig((_env, argv) => {
         },
         shared: ['react', 'react-dom'],
       }),
-    ],
+    ].filter(Boolean),
   };
 });

package/dist/src/generators/remote/remote.js

@@ -188,6 +188,11 @@ async function remoteGenerator(host, schema) {
             : {}),
     }, undefined, true);
     tasks.push(installTask);
+    // The TS config templates use extensionless relative imports and
+    // `__dirname`, which Node's native type stripping cannot load.
+    if (options.typescriptConfiguration) {
+        tasks.push((0, internal_3.addSwcRegisterDependencies)(host));
+    }
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(host);
     }

package/dist/src/utils/ct-utils.d.ts

@@ -1,11 +1,19 @@
 import { Tree } from '@nx/devkit';
 import { type FoundTarget } from '@nx/cypress/internal';
-export declare function configureCypressCT(tree: Tree, options: {
+export declare function resolveCypressCTTarget(tree: Tree, options: {
     project: string;
     buildTarget: string;
     bundler: 'vite' | 'webpack';
     validExecutorNames: Set<string>;
-}): Promise<FoundTarget>;
+}): Promise<{
+    found: FoundTarget;
+    bundler: 'vite' | 'webpack';
+}>;
+export declare function configureCypressCT(tree: Tree, options: {
+    project: string;
+    found: FoundTarget;
+    bundler: 'vite' | 'webpack';
+}): Promise<void>;
 export declare function getBundlerFromTarget(found: FoundTarget, tree: Tree): Promise<'vite' | 'webpack'>;
 export declare function getActualBundler(tree: Tree, options: {
     buildTarget?: string;

package/dist/src/utils/ct-utils.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.resolveCypressCTTarget = resolveCypressCTTarget;
 exports.configureCypressCT = configureCypressCT;
 exports.getBundlerFromTarget = getBundlerFromTarget;
 exports.getActualBundler = getActualBundler;
@@ -10,9 +11,9 @@ const ast_utils_1 = require("./ast-utils");
 let tsModule;
 const allowedFileExt = new RegExp(/\.[jt]sx?/);
 const isSpecFile = new RegExp(/(spec|test)\./);
-async function configureCypressCT(tree, options) {
+// Resolved before the shared cypress generator runs, so the bundler reaches it.
+async function resolveCypressCTTarget(tree, options) {
     let found = { target: options.buildTarget, config: undefined };
-    const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     // Specifically undefined as a workaround for Remix to pass an empty string as the buildTarget
     if (options.buildTarget === undefined) {
         const { findBuildConfig, } = require('@nx/cypress/internal');
@@ -32,9 +33,17 @@ async function configureCypressCT(tree, options) {
             throw new Error(`Cypress Component Testing is not currently supported for this project. Either 'executer' is not defined in '${target} target' of '${project} project.json' or executer present is not valid one. Valid ones are ${JSON.stringify([...options.validExecutorNames])}. Please check https://github.com/nrwl/nx/issues/21546 for more information.`);
         }
     }
+    return {
+        found,
+        bundler: options.bundler ?? (await getActualBundler(tree, options, found)),
+    };
+}
+async function configureCypressCT(tree, options) {
+    const { found } = options;
+    const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     const { addDefaultCTConfig, getProjectCypressConfigPath, getInstalledCypressMajorVersion, } = require('@nx/cypress/internal');
     const ctConfigOptions = {
-        bundler: options.bundler ?? (await getActualBundler(tree, options, found)),
+        bundler: options.bundler,
     };
     if (projectConfig.targets?.['component-test']?.executor ===
         '@nx/cypress:cypress') {
@@ -51,7 +60,6 @@ async function configureCypressCT(tree, options) {
     const cypressConfigFilePath = getProjectCypressConfigPath(tree, projectConfig.root);
     const updatedCyConfig = await addDefaultCTConfig(tree.read(cypressConfigFilePath, 'utf-8'), ctConfigOptions, '@nx/react/plugins/component-testing', getInstalledCypressMajorVersion(tree));
     tree.write(cypressConfigFilePath, updatedCyConfig);
-    return found;
 }
 function assertValidConfig(config) {
     if (!config) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react",
-  "version": "23.3.0-canary.20260915-071d621",
+  "version": "23.3.0-canary.20260917-ea5c01d",
   "private": false,
   "description": "The React plugin for Nx contains executors and generators for managing React applications and libraries within an Nx workspace. It provides:\n\n\n- Integration with libraries such as Jest, Vitest, Playwright, Cypress, and Storybook.\n\n- Generators for applications, libraries, components, hooks, and more.\n\n- Library build support for publishing packages to npm or other registries.\n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -96,7 +96,7 @@
     "react-dom": ">=18.0.0 <20.0.0",
     "express": "^4.21.2",
     "http-proxy-middleware": "^3.0.7",
-    "@nx/module-federation": "23.3.0-canary.20260915-071d621"
+    "@nx/module-federation": "23.3.0-canary.20260917-ea5c01d"
   },
   "peerDependenciesMeta": {
     "babel-plugin-react-compiler": {
@@ -118,27 +118,27 @@
     "minimatch": "10.2.5",
     "tslib": "^2.3.0",
     "semver": "^7.6.3",
-    "@nx/devkit": "23.3.0-canary.20260915-071d621",
-    "@nx/js": "23.3.0-canary.20260915-071d621",
-    "@nx/eslint": "23.3.0-canary.20260915-071d621",
-    "@nx/web": "23.3.0-canary.20260915-071d621"
+    "@nx/devkit": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/js": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/eslint": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/web": "23.3.0-canary.20260917-ea5c01d"
   },
   "devDependencies": {
     "express": "^4.21.2",
     "http-proxy-middleware": "^3.0.7",
-    "@nx/cypress": "23.3.0-canary.20260915-071d621",
-    "@nx/module-federation": "23.3.0-canary.20260915-071d621",
-    "@nx/playwright": "23.3.0-canary.20260915-071d621",
-    "@nx/rollup": "23.3.0-canary.20260915-071d621",
-    "@nx/rsbuild": "23.3.0-canary.20260915-071d621",
-    "@nx/vite": "23.3.0-canary.20260915-071d621",
-    "@nx/vitest": "23.3.0-canary.20260915-071d621",
-    "@nx/webpack": "23.3.0-canary.20260915-071d621",
-    "@nx/storybook": "23.3.0-canary.20260915-071d621",
-    "nx": "23.3.0-canary.20260915-071d621"
+    "@nx/cypress": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/module-federation": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/playwright": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/rollup": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/rsbuild": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/vite": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/vitest": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/webpack": "23.3.0-canary.20260917-ea5c01d",
+    "@nx/storybook": "23.3.0-canary.20260917-ea5c01d",
+    "nx": "23.3.0-canary.20260917-ea5c01d"
   },
   "optionalDependencies": {
-    "@nx/vite": "23.3.0-canary.20260915-071d621"
+    "@nx/vite": "23.3.0-canary.20260917-ea5c01d"
   },
   "publishConfig": {
     "access": "public"