@nx/react 18.1.0 → 18.1.1

package/migrations.json

@@ -53,6 +53,12 @@
       "version": "18.0.0-beta.0",
       "description": "Add NX_MF_DEV_SERVER_STATIC_REMOTES to inputs for task hashing when '@nx/webpack:webpack' is used for Module Federation.",
       "factory": "./src/migrations/update-18-0-0/add-mf-env-var-to-target-defaults"
+    },
+    "fix-target-defaults-for-webpack": {
+      "cli": "nx",
+      "version": "18.1.1-beta.0",
+      "description": "Ensure targetDefaults inputs for task hashing when '@nx/webpack:webpack' is used are correct for Module Federation.",
+      "factory": "./src/migrations/update-18-1-1/fix-target-defaults-inputs"
     }
   },
   "packageJsonUpdates": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react",
-  "version": "18.1.0",
+  "version": "18.1.1",
   "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, 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": {
@@ -36,11 +36,11 @@
     "chalk": "^4.1.0",
     "minimatch": "9.0.3",
     "tslib": "^2.3.0",
-    "@nx/devkit": "18.1.0",
-    "@nx/js": "18.1.0",
-    "@nx/eslint": "18.1.0",
-    "@nx/web": "18.1.0",
-    "@nrwl/react": "18.1.0"
+    "@nx/devkit": "18.1.1",
+    "@nx/js": "18.1.1",
+    "@nx/eslint": "18.1.1",
+    "@nx/web": "18.1.1",
+    "@nrwl/react": "18.1.1"
   },
   "publishConfig": {
     "access": "public"

package/src/generators/application/application.js

@@ -143,7 +143,7 @@ async function applicationGeneratorInternal(host, schema) {
             tsConfig: (0, devkit_1.joinPathFragments)(options.appProjectRoot, 'tsconfig.app.json'),
             target: 'web',
             newProject: true,
-            uiFramework: 'react',
+            framework: 'react',
         });
         tasks.push(rspackTask);
     }
@@ -201,8 +201,8 @@ async function applicationGeneratorInternal(host, schema) {
         devkit_1.logger.warn(`${chalk.bold('styled-jsx')} is not supported by ${chalk.bold('Rspack')}. We've added ${chalk.bold('babel-loader')} to your project, but using babel will slow down your build.`);
         tasks.push((0, devkit_1.addDependenciesToPackageJson)(host, {}, { 'babel-loader': versions_1.babelLoaderVersion }));
         host.write((0, devkit_1.joinPathFragments)(options.appProjectRoot, 'rspack.config.js'), (0, devkit_1.stripIndents) `
-        const { composePlugins, withNx, withWeb } = require('@nx/rspack');
-        module.exports = composePlugins(withNx(), withWeb(), (config) => {
+        const { composePlugins, withNx, withReact } = require('@nx/rspack');
+        module.exports = composePlugins(withNx(), withReact(), (config) => {
           config.module.rules.push({
             test: /\\.[jt]sx$/i,
             use: [

package/src/migrations/update-18-1-1/fix-target-defaults-inputs.d.ts

@@ -0,0 +1,2 @@
+import { type Tree } from '@nx/devkit';
+export default function (tree: Tree): Promise<void>;

package/src/migrations/update-18-1-1/fix-target-defaults-inputs.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const devkit_1 = require("@nx/devkit");
+async function default_1(tree) {
+    if (!hasModuleFederationProject(tree)) {
+        return;
+    }
+    ensureTargetDefaultsContainProductionInputs(tree);
+    await (0, devkit_1.formatFiles)(tree);
+}
+exports.default = default_1;
+function ensureTargetDefaultsContainProductionInputs(tree) {
+    const nxJson = (0, devkit_1.readNxJson)(tree);
+    const webpackExecutor = '@nx/webpack:webpack';
+    const mfEnvVar = 'NX_MF_DEV_SERVER_STATIC_REMOTES';
+    nxJson.targetDefaults[webpackExecutor] ??= {};
+    nxJson.targetDefaults[webpackExecutor].inputs ??= [
+        'production',
+        '^production',
+        { env: mfEnvVar },
+    ];
+    if (!nxJson.targetDefaults[webpackExecutor].inputs.includes('production')) {
+        nxJson.targetDefaults[webpackExecutor].inputs.push('production');
+    }
+    if (!nxJson.targetDefaults[webpackExecutor].inputs.includes('^production')) {
+        nxJson.targetDefaults[webpackExecutor].inputs.push('^production');
+    }
+    let mfEnvVarExists = false;
+    for (const input of nxJson.targetDefaults[webpackExecutor].inputs) {
+        if (typeof input === 'object' && input['env'] === mfEnvVar) {
+            mfEnvVarExists = true;
+            break;
+        }
+    }
+    if (!mfEnvVarExists) {
+        nxJson.targetDefaults[webpackExecutor].inputs.push({ env: mfEnvVar });
+    }
+    (0, devkit_1.updateNxJson)(tree, nxJson);
+}
+function hasModuleFederationProject(tree) {
+    const projects = (0, devkit_1.getProjects)(tree);
+    for (const project of projects.values()) {
+        const targets = project.targets || {};
+        for (const [_, target] of Object.entries(targets)) {
+            if (target.executor === '@nx/webpack:webpack' &&
+                (tree.exists((0, devkit_1.joinPathFragments)(project.root, 'module-federation.config.ts')) ||
+                    tree.exists((0, devkit_1.joinPathFragments)(project.root, 'module-federation.config.js')))) {
+                return true;
+            }
+        }
+    }
+    return false;
+}

package/src/utils/add-mf-env-to-inputs.js

@@ -8,7 +8,10 @@ function addMfEnvToTargetDefaultInputs(tree) {
     const mfEnvVar = 'NX_MF_DEV_SERVER_STATIC_REMOTES';
     nxJson.targetDefaults ??= {};
     nxJson.targetDefaults[webpackExecutor] ??= {};
-    nxJson.targetDefaults[webpackExecutor].inputs ??= [];
+    nxJson.targetDefaults[webpackExecutor].inputs ??= [
+        'production',
+        '^production',
+    ];
     let mfEnvVarExists = false;
     for (const input of nxJson.targetDefaults[webpackExecutor].inputs) {
         if (typeof input === 'object' && input['env'] === mfEnvVar) {