@nx/react 19.0.2 → 19.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/react",
-  "version": "19.0.2",
+  "version": "19.0.3",
   "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": {
@@ -37,11 +37,11 @@
     "file-loader": "^6.2.0",
     "minimatch": "9.0.3",
     "tslib": "^2.3.0",
-    "@nx/devkit": "19.0.2",
-    "@nx/js": "19.0.2",
-    "@nx/eslint": "19.0.2",
-    "@nx/web": "19.0.2",
-    "@nrwl/react": "19.0.2"
+    "@nx/devkit": "19.0.3",
+    "@nx/js": "19.0.3",
+    "@nx/eslint": "19.0.3",
+    "@nx/web": "19.0.3",
+    "@nrwl/react": "19.0.3"
   },
   "publishConfig": {
     "access": "public"

package/plugins/nx-react-webpack-plugin/lib/apply-react-config.d.ts

@@ -1,4 +1,5 @@
 import { Configuration, WebpackOptionsNormalized } from 'webpack';
+import { SvgrOptions } from '../../with-react';
 export declare function applyReactConfig(options: {
-    svgr?: boolean;
+    svgr?: boolean | SvgrOptions;
 }, config?: Partial<WebpackOptionsNormalized | Configuration>): void;

package/plugins/nx-react-webpack-plugin/lib/apply-react-config.js

@@ -5,8 +5,14 @@ function applyReactConfig(options, config = {}) {
     if (!process.env['NX_TASK_TARGET_PROJECT'])
         return;
     addHotReload(config);
-    if (options.svgr !== false) {
+    if (options.svgr !== false || typeof options.svgr === 'object') {
         removeSvgLoaderIfPresent(config);
+        const defaultSvgrOptions = {
+            svgo: false,
+            titleProp: true,
+            ref: true,
+        };
+        const svgrOptions = typeof options.svgr === 'object' ? options.svgr : defaultSvgrOptions;
         // TODO(v20): Remove file-loader and use `?react` querystring to differentiate between asset and SVGR.
         // It should be:
         // use: [{
@@ -33,11 +39,7 @@ function applyReactConfig(options, config = {}) {
             use: [
                 {
                     loader: require.resolve('@svgr/webpack'),
-                    options: {
-                        svgo: false,
-                        titleProp: true,
-                        ref: true,
-                    },
+                    options: svgrOptions,
                 },
                 {
                     loader: require.resolve('file-loader'),

package/plugins/with-react.d.ts

@@ -1,7 +1,12 @@
 import type { Configuration } from 'webpack';
 import type { NxWebpackExecutionContext, WithWebOptions } from '@nx/webpack';
+export interface SvgrOptions {
+    svgo?: boolean;
+    titleProp?: boolean;
+    ref?: boolean;
+}
 export interface WithReactOptions extends WithWebOptions {
-    svgr?: false;
+    svgr?: boolean | SvgrOptions;
 }
 /**
  * @param {WithReactOptions} pluginOptions

package/src/generators/host/host.js

@@ -12,6 +12,7 @@ const normalize_remote_1 = require("./lib/normalize-remote");
 const setup_ssr_for_host_1 = require("./lib/setup-ssr-for-host");
 const update_module_federation_e2e_project_1 = require("./lib/update-module-federation-e2e-project");
 const add_mf_env_to_inputs_1 = require("../../utils/add-mf-env-to-inputs");
+const js_1 = require("@nx/js");
 async function hostGenerator(host, schema) {
     return hostGeneratorInternal(host, {
         projectNameAndRootFormat: 'derived',
@@ -31,6 +32,16 @@ async function hostGeneratorInternal(host, schema) {
         // TODO(colum): remove when MF works with Crystal
         addPlugin: false,
     };
+    // Check to see if remotes are provided and also check if --dynamic is provided
+    // if both are check that the remotes are valid names else throw an error.
+    if (options.dynamic && options.remotes?.length > 0) {
+        options.remotes.forEach((remote) => {
+            const isValidRemote = (0, js_1.isValidVariable)(remote);
+            if (!isValidRemote.isValid) {
+                throw new Error(`Invalid remote name provided: ${remote}. ${isValidRemote.message}`);
+            }
+        });
+    }
     const initTask = await (0, application_1.default)(host, {
         ...options,
         // The target use-case is loading remotes as child routes, thus always enable routing.

package/src/generators/remote/remote.js

@@ -13,6 +13,7 @@ const setup_tspath_for_remote_1 = require("./lib/setup-tspath-for-remote");
 const add_remote_to_dynamic_host_1 = require("./lib/add-remote-to-dynamic-host");
 const add_mf_env_to_inputs_1 = require("../../utils/add-mf-env-to-inputs");
 const maybe_js_1 = require("../../utils/maybe-js");
+const js_1 = require("@nx/js");
 function addModuleFederationFiles(host, options) {
     const templateVariables = {
         ...(0, devkit_1.names)(options.name),
@@ -56,6 +57,14 @@ async function remoteGeneratorInternal(host, schema) {
         // TODO(colum): remove when MF works with Crystal
         addPlugin: false,
     };
+    if (options.dynamic) {
+        // Dynamic remotes generate with library { type: 'var' } by default.
+        // We need to ensure that the remote name is a valid variable name.
+        const isValidRemote = (0, js_1.isValidVariable)(options.name);
+        if (!isValidRemote.isValid) {
+            throw new Error(`Invalid remote name provided: ${options.name}. ${isValidRemote.message}`);
+        }
+    }
     const initAppTask = await (0, application_1.default)(host, {
         ...options,
         // Only webpack works with module federation for now.