@nx/react 20.5.0-canary.20250213-b8ee838 → 21.0.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react",
-  "version": "20.5.0-canary.20250213-b8ee838",
+  "version": "21.0.0-beta.0",
   "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": {
@@ -38,11 +38,11 @@
     "minimatch": "9.0.3",
     "picocolors": "^1.1.0",
     "tslib": "^2.3.0",
-    "@nx/devkit": "20.5.0-canary.20250213-b8ee838",
-    "@nx/js": "20.5.0-canary.20250213-b8ee838",
-    "@nx/eslint": "20.5.0-canary.20250213-b8ee838",
-    "@nx/web": "20.5.0-canary.20250213-b8ee838",
-    "@nx/module-federation": "20.5.0-canary.20250213-b8ee838",
+    "@nx/devkit": "21.0.0-beta.0",
+    "@nx/js": "21.0.0-beta.0",
+    "@nx/eslint": "21.0.0-beta.0",
+    "@nx/web": "21.0.0-beta.0",
+    "@nx/module-federation": "21.0.0-beta.0",
     "express": "^4.21.2",
     "http-proxy-middleware": "^3.0.3",
     "semver": "^7.6.3"

package/src/generators/application/application.js

@@ -92,6 +92,9 @@ async function applicationGeneratorInternal(tree, schema) {
     if (options.bundler === 'vite') {
         await (0, add_vite_1.setupViteConfiguration)(tree, options, tasks);
     }
+    else if (options.bundler === 'rspack') {
+        await (0, add_rspack_1.setupRspackConfiguration)(tree, options, tasks);
+    }
     else if (options.bundler === 'rsbuild') {
         await (0, add_rsbuild_1.setupRsbuildConfiguration)(tree, options, tasks);
     }

package/src/generators/application/lib/bundlers/add-rspack.d.ts

@@ -1,4 +1,5 @@
 import { type Tree } from '@nx/devkit';
 import { NormalizedSchema, Schema } from '../../schema';
 export declare function initRspack(tree: Tree, options: NormalizedSchema<Schema>, tasks: any[]): Promise<void>;
+export declare function setupRspackConfiguration(tree: Tree, options: NormalizedSchema<Schema>, tasks: any[]): Promise<void>;
 export declare function handleStyledJsxForRspack(tasks: any[], tree: Tree, options: NormalizedSchema<Schema>): void;

package/src/generators/application/lib/bundlers/add-rspack.js

@@ -1,18 +1,36 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.initRspack = initRspack;
+exports.setupRspackConfiguration = setupRspackConfiguration;
 exports.handleStyledJsxForRspack = handleStyledJsxForRspack;
 const devkit_1 = require("@nx/devkit");
 const pc = require("picocolors");
 const versions_1 = require("../../../../utils/versions");
+const maybe_js_1 = require("../../../../utils/maybe-js");
 async function initRspack(tree, options, tasks) {
     const { rspackInitGenerator } = (0, devkit_1.ensurePackage)('@nx/rspack', versions_1.nxVersion);
     const rspackInitTask = await rspackInitGenerator(tree, {
         ...options,
+        addPlugin: false,
         skipFormat: true,
     });
     tasks.push(rspackInitTask);
 }
+async function setupRspackConfiguration(tree, options, tasks) {
+    const { configurationGenerator } = (0, devkit_1.ensurePackage)('@nx/rspack', versions_1.nxVersion);
+    const rspackTask = await configurationGenerator(tree, {
+        project: options.projectName,
+        main: (0, devkit_1.joinPathFragments)(options.appProjectRoot, (0, maybe_js_1.maybeJs)({
+            js: options.js,
+            useJsx: true,
+        }, `src/main.tsx`)),
+        tsConfig: (0, devkit_1.joinPathFragments)(options.appProjectRoot, 'tsconfig.app.json'),
+        target: 'web',
+        newProject: true,
+        framework: 'react',
+    });
+    tasks.push(rspackTask);
+}
 function handleStyledJsxForRspack(tasks, tree, options) {
     devkit_1.logger.warn(`${pc.bold('styled-jsx')} is not supported by ${pc.bold('Rspack')}. We've added ${pc.bold('babel-loader')} to your project, but using babel will slow down your build.`);
     tasks.push((0, devkit_1.addDependenciesToPackageJson)(tree, {}, { 'babel-loader': versions_1.babelLoaderVersion }));

package/src/generators/application/lib/get-app-tests.js

@@ -11,9 +11,9 @@ function getAppTests(options) {
 
   it('should have a greeting as the title', () => {
     ${options.routing
-        ? 'const { getAllByText } = render(<BrowserRouter><App /></BrowserRouter>);'
-        : 'const { getAllByText } = render(<App />);'}
-    expect(getAllByText(new RegExp('Welcome ${options.projectName}', 'gi')).length > 0).toBeTruthy();
+        ? 'const { getByText } = render(<BrowserRouter><App /></BrowserRouter>);'
+        : 'const { getByText } = render(<App />);'}
+    expect(getByText(new RegExp('Welcome ${options.projectName}', 'gi'))).toBeTruthy();
   });
 `;
 }