@nx/react 17.0.5 → 17.0.6

package/src/executors/module-federation-dev-server/module-federation-dev-server.impl.js

@@ -1,18 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseStaticRemotesConfig = void 0;
 const devkit_1 = require("@nx/devkit");
 const dev_server_impl_1 = require("@nx/webpack/src/executors/dev-server/dev-server.impl");
 const file_server_impl_1 = require("@nx/web/src/executors/file-server/file-server.impl");
 const module_federation_1 = require("@nx/webpack/src/utils/module-federation");
 const async_iterable_1 = require("@nx/devkit/src/utils/async-iterable");
 const wait_for_port_open_1 = require("@nx/web/src/utils/wait-for-port-open");
-const cache_directory_1 = require("nx/src/utils/cache-directory");
-const node_child_process_1 = require("node:child_process");
-const node_path_1 = require("node:path");
-const node_fs_1 = require("node:fs");
-const fs_1 = require("fs");
-const path_1 = require("path");
+const child_process_1 = require("child_process");
 function getBuildOptions(buildTarget, context) {
     const target = (0, devkit_1.parseTargetString)(buildTarget, context);
     const buildOptions = (0, devkit_1.readTargetOptions)(target, context);
@@ -20,133 +14,7 @@ function getBuildOptions(buildTarget, context) {
         ...buildOptions,
     };
 }
-function startStaticRemotesFileServer(staticRemotesConfig, context, options) {
-    let shouldMoveToCommonLocation = false;
-    let commonOutputDirectory;
-    for (const app of staticRemotesConfig.remotes) {
-        const remoteBasePath = staticRemotesConfig.config[app].basePath;
-        if (!commonOutputDirectory) {
-            commonOutputDirectory = remoteBasePath;
-        }
-        else if (commonOutputDirectory !== remoteBasePath) {
-            shouldMoveToCommonLocation = true;
-            break;
-        }
-    }
-    if (shouldMoveToCommonLocation) {
-        commonOutputDirectory = (0, node_path_1.join)(devkit_1.workspaceRoot, 'tmp/static-remotes');
-        for (const app of staticRemotesConfig.remotes) {
-            const remoteConfig = staticRemotesConfig.config[app];
-            (0, node_fs_1.cpSync)(remoteConfig.outputPath, (0, node_path_1.join)(commonOutputDirectory, remoteConfig.urlSegment), {
-                force: true,
-                recursive: true,
-            });
-        }
-    }
-    const staticRemotesIter = (0, file_server_impl_1.default)({
-        cors: true,
-        watch: false,
-        staticFilePath: commonOutputDirectory,
-        parallel: false,
-        spa: false,
-        withDeps: false,
-        host: options.host,
-        port: options.staticRemotesPort,
-        ssl: options.ssl,
-        sslCert: options.sslCert,
-        sslKey: options.sslKey,
-    }, context);
-    return staticRemotesIter;
-}
-async function startRemotes(remotes, context, options, target = 'serve') {
-    const remoteIters = [];
-    for (const app of remotes) {
-        const remoteProjectServeTarget = context.projectGraph.nodes[app].data.targets[target];
-        const isUsingModuleFederationDevServerExecutor = remoteProjectServeTarget.executor.includes('module-federation-dev-server');
-        const overrides = target === 'serve'
-            ? {
-                watch: true,
-                ...(options.host ? { host: options.host } : {}),
-                ...(options.ssl ? { ssl: options.ssl } : {}),
-                ...(options.sslCert ? { sslCert: options.sslCert } : {}),
-                ...(options.sslKey ? { sslKey: options.sslKey } : {}),
-                ...(isUsingModuleFederationDevServerExecutor
-                    ? { isInitialHost: false }
-                    : {}),
-            }
-            : {};
-        remoteIters.push(await (0, devkit_1.runExecutor)({
-            project: app,
-            target,
-            configuration: context.configurationName,
-        }, overrides, context));
-    }
-    return remoteIters;
-}
-async function buildStaticRemotes(staticRemotesConfig, nxBin, context, options) {
-    if (!staticRemotesConfig.remotes.length) {
-        return;
-    }
-    devkit_1.logger.info(`NX Building ${staticRemotesConfig.remotes.length} static remotes...`);
-    const mappedLocationOfRemotes = {};
-    for (const app of staticRemotesConfig.remotes) {
-        mappedLocationOfRemotes[app] = `http${options.ssl ? 's' : ''}://${options.host}:${options.staticRemotesPort}/${staticRemotesConfig.config[app].urlSegment}`;
-    }
-    process.env.NX_MF_DEV_SERVER_STATIC_REMOTES = JSON.stringify(mappedLocationOfRemotes);
-    await new Promise((res) => {
-        const staticProcess = (0, node_child_process_1.fork)(nxBin, [
-            'run-many',
-            `--target=build`,
-            `--projects=${staticRemotesConfig.remotes.join(',')}`,
-            ...(context.configurationName
-                ? [`--configuration=${context.configurationName}`]
-                : []),
-            ...(options.parallel ? [`--parallel=${options.parallel}`] : []),
-        ], {
-            cwd: context.root,
-            stdio: ['ignore', 'pipe', 'pipe', 'ipc'],
-        });
-        // File to debug build failures e.g. 2024-01-01T00_00_0_0Z-build.log'
-        const remoteBuildLogFile = (0, node_path_1.join)(cache_directory_1.projectGraphCacheDirectory, `${new Date().toISOString().replace(/[:\.]/g, '_')}-build.log`);
-        const stdoutStream = (0, node_fs_1.createWriteStream)(remoteBuildLogFile);
-        staticProcess.stdout.on('data', (data) => {
-            const ANSII_CODE_REGEX = /[\u001b\u009b][[()#;?]*(?:[0-9]{1,4}(?:;[0-9]{0,4})*)?[0-9A-ORZcf-nqry=><]/g;
-            const stdoutString = data.toString().replace(ANSII_CODE_REGEX, '');
-            stdoutStream.write(stdoutString);
-            if (stdoutString.includes('Successfully ran target build')) {
-                staticProcess.stdout.removeAllListeners('data');
-                devkit_1.logger.info(`NX Built ${staticRemotesConfig.remotes.length} static remotes`);
-                res();
-            }
-        });
-        staticProcess.stderr.on('data', (data) => devkit_1.logger.info(data.toString()));
-        staticProcess.on('exit', (code) => {
-            stdoutStream.end();
-            if (code !== 0) {
-                throw new Error(`Remote failed to start. A complete log can be found in: ${remoteBuildLogFile}`);
-            }
-        });
-        process.on('SIGTERM', () => staticProcess.kill('SIGTERM'));
-        process.on('exit', () => staticProcess.kill('SIGTERM'));
-    });
-}
-function parseStaticRemotesConfig(staticRemotes, context) {
-    if (!staticRemotes?.length) {
-        return { remotes: [], config: undefined };
-    }
-    const config = {};
-    for (const app of staticRemotes) {
-        const outputPath = context.projectGraph.nodes[app].data.targets['build'].options.outputPath;
-        const basePath = (0, node_path_1.dirname)(outputPath);
-        const urlSegment = (0, node_path_1.basename)(outputPath);
-        config[app] = { basePath, outputPath, urlSegment };
-    }
-    return { remotes: staticRemotes, config };
-}
-exports.parseStaticRemotesConfig = parseStaticRemotesConfig;
 async function* moduleFederationDevServer(options, context) {
-    const initialStaticRemotesPorts = options.staticRemotesPort;
-    options.staticRemotesPort ??= options.port + 1;
     // Force Node to resolve to look for the nx binary that is inside node_modules
     const nxBin = require.resolve('nx/bin/nx');
     const currIter = options.static
@@ -160,17 +28,6 @@ async function* moduleFederationDevServer(options, context) {
         : (0, dev_server_impl_1.default)(options, context);
     const p = context.projectsConfigurations.projects[context.projectName];
     const buildOptions = getBuildOptions(options.buildTarget, context);
-    let pathToManifestFile = (0, node_path_1.join)(context.root, p.sourceRoot, 'assets/module-federation.manifest.json');
-    if (options.pathToManifestFile) {
-        const userPathToManifestFile = (0, node_path_1.join)(context.root, options.pathToManifestFile);
-        if (!(0, fs_1.existsSync)(userPathToManifestFile)) {
-            throw new Error(`The provided Module Federation manifest file path does not exist. Please check the file exists at "${userPathToManifestFile}".`);
-        }
-        else if ((0, path_1.extname)(options.pathToManifestFile) !== '.json') {
-            throw new Error(`The Module Federation manifest file must be a JSON. Please ensure the file at ${userPathToManifestFile} is a JSON.`);
-        }
-        pathToManifestFile = userPathToManifestFile;
-    }
     if (!options.isInitialHost) {
         return yield* currIter;
     }
@@ -179,26 +36,57 @@ async function* moduleFederationDevServer(options, context) {
         projectName: context.projectName,
         projectGraph: context.projectGraph,
         root: context.root,
-    }, pathToManifestFile);
-    if (remotes.devRemotes.length > 0 && !initialStaticRemotesPorts) {
-        options.staticRemotesPort = options.devRemotes.reduce((portToUse, r) => {
-            const remotePort = context.projectGraph.nodes[r].data.targets['serve'].options.port;
-            if (remotePort >= portToUse) {
-                return remotePort + 1;
+    });
+    let isCollectingStaticRemoteOutput = true;
+    const devRemoteIters = [];
+    for (const app of remotes.devRemotes) {
+        const remoteProjectServeTarget = context.projectGraph.nodes[app].data.targets['serve'];
+        const isUsingModuleFederationDevServerExecutor = remoteProjectServeTarget.executor.includes('module-federation-dev-server');
+        devRemoteIters.push(await (0, devkit_1.runExecutor)({
+            project: app,
+            target: 'serve',
+            configuration: context.configurationName,
+        }, {
+            watch: true,
+            ...(isUsingModuleFederationDevServerExecutor
+                ? { isInitialHost: false }
+                : {}),
+        }, context));
+    }
+    for (const app of remotes.staticRemotes) {
+        const remoteProjectServeTarget = context.projectGraph.nodes[app].data.targets['serve-static'];
+        const isUsingModuleFederationDevServerExecutor = remoteProjectServeTarget.executor.includes('module-federation-dev-server');
+        let outWithErr = [];
+        const staticProcess = (0, child_process_1.fork)(nxBin, [
+            'run',
+            `${app}:serve-static${context.configurationName ? `:${context.configurationName}` : ''}`,
+            ...(isUsingModuleFederationDevServerExecutor
+                ? [`--isInitialHost=false`]
+                : []),
+        ], {
+            cwd: context.root,
+            stdio: ['ignore', 'pipe', 'pipe', 'ipc'],
+        });
+        staticProcess.stdout.on('data', (data) => {
+            if (isCollectingStaticRemoteOutput) {
+                outWithErr.push(data.toString());
             }
             else {
-                return portToUse;
+                outWithErr = null;
+                staticProcess.stdout.removeAllListeners('data');
+            }
+        });
+        staticProcess.stderr.on('data', (data) => devkit_1.logger.info(data.toString()));
+        staticProcess.on('exit', (code) => {
+            if (code !== 0) {
+                devkit_1.logger.info(outWithErr.join(''));
+                throw new Error(`Remote failed to start. See above for errors.`);
             }
-        }, options.staticRemotesPort);
+        });
+        process.on('SIGTERM', () => staticProcess.kill('SIGTERM'));
+        process.on('exit', () => staticProcess.kill('SIGTERM'));
     }
-    const staticRemotesConfig = parseStaticRemotesConfig(remotes.staticRemotes, context);
-    await buildStaticRemotes(staticRemotesConfig, nxBin, context, options);
-    const devRemoteIters = await startRemotes(remotes.devRemotes, context, options, 'serve');
-    const dynamicRemotesIters = await startRemotes(remotes.dynamicRemotes, context, options, 'serve-static');
-    const staticRemotesIter = remotes.staticRemotes.length > 0
-        ? startStaticRemotesFileServer(staticRemotesConfig, context, options)
-        : undefined;
-    return yield* (0, async_iterable_1.combineAsyncIterables)(currIter, ...devRemoteIters, ...dynamicRemotesIters, ...(staticRemotesIter ? [staticRemotesIter] : []), (0, async_iterable_1.createAsyncIterable)(async ({ next, done }) => {
+    return yield* (0, async_iterable_1.combineAsyncIterables)(currIter, ...devRemoteIters, (0, async_iterable_1.createAsyncIterable)(async ({ next, done }) => {
         if (!options.isInitialHost) {
             done();
             return;
@@ -208,23 +96,20 @@ async function* moduleFederationDevServer(options, context) {
             return;
         }
         try {
-            const host = options.host ?? 'localhost';
-            const baseUrl = `http${options.ssl ? 's' : ''}://${host}:${options.port}`;
-            const portsToWaitFor = staticRemotesIter
-                ? [options.staticRemotesPort, ...remotes.remotePorts]
-                : [...remotes.remotePorts];
-            await Promise.all(portsToWaitFor.map((port) => (0, wait_for_port_open_1.waitForPortOpen)(port, {
+            await Promise.all(remotes.remotePorts.map((port) => 
+            // Allow 20 minutes for each remote to start, which is plenty of time but we can tweak it later if needed.
+            // Most remotes should start in under 1 minute.
+            (0, wait_for_port_open_1.waitForPortOpen)(port, {
                 retries: 480,
                 retryDelay: 2500,
-                host: host,
+                host: 'localhost',
             })));
-            devkit_1.logger.info(`NX All remotes started, server ready at ${baseUrl}`);
-            next({ success: true, baseUrl: baseUrl });
+            isCollectingStaticRemoteOutput = false;
+            devkit_1.logger.info(`NX All remotes started, server ready at http://localhost:${options.port}`);
+            next({ success: true, baseUrl: `http://localhost:${options.port}` });
         }
-        catch (err) {
-            throw new Error(`Failed to start remotes. Check above for any errors.`, {
-                cause: err,
-            });
+        catch {
+            throw new Error(`Timed out waiting for remote to start. Check above for any errors.`);
         }
         finally {
             done();

package/src/executors/module-federation-dev-server/schema.json

@@ -19,7 +19,7 @@
       "items": {
         "type": "string"
       },
-      "description": "List of remote applications to not automatically serve, either statically or in development mode. This will not remove the remotes from the `module-federation.config` file, and therefore the application may still try to fetch these remotes.\nThis option is useful for when the `host` application is using a `remote` that does not live in the same workspace as the `host`.",
+      "description": "List of remote applications to not automatically serve, either statically or in development mode.",
       "x-priority": "important"
     },
     "buildTarget": {
@@ -101,18 +101,6 @@
       "description": "Whether the host that is running this executor is the first in the project tree to do so.",
       "default": true,
       "x-priority": "internal"
-    },
-    "parallel": {
-      "type": "number",
-      "description": "Max number of parallel processes for building static remotes"
-    },
-    "staticRemotesPort": {
-      "type": "number",
-      "description": "The port at which to serve the file-server for the static remotes."
-    },
-    "pathToManifestFile": {
-      "type": "string",
-      "description": "Path to a Module Federation manifest file (e.g. `my/path/to/module-federation.manifest.json`) containing the dynamic remote applications relative to the workspace root."
     }
   }
 }

package/src/generators/application/application.js

@@ -13,8 +13,8 @@ const add_styled_dependencies_1 = require("../../rules/add-styled-dependencies")
 const devkit_1 = require("@nx/devkit");
 const init_1 = require("../init/init");
 const eslint_1 = require("@nx/eslint");
+const lint_project_1 = require("@nx/eslint/src/generators/lint-project/lint-project");
 const versions_1 = require("../../utils/versions");
-const maybe_js_1 = require("../../utils/maybe-js");
 const install_common_dependencies_1 = require("./lib/install-common-dependencies");
 const create_ts_config_1 = require("../../utils/create-ts-config");
 const add_swc_dependencies_1 = require("@nx/js/src/utils/swc/add-swc-dependencies");
@@ -22,9 +22,6 @@ const chalk = require("chalk");
 const show_possible_warnings_1 = require("./lib/show-possible-warnings");
 const add_e2e_1 = require("./lib/add-e2e");
 const eslint_file_1 = require("@nx/eslint/src/generators/utils/eslint-file");
-const js_1 = require("@nx/js");
-const log_show_project_command_1 = require("@nx/devkit/src/utils/log-show-project-command");
-const setup_tailwind_1 = require("../setup-tailwind/setup-tailwind");
 async function addLinting(host, options) {
     const tasks = [];
     if (options.linter === eslint_1.Linter.EsLint) {
@@ -35,10 +32,12 @@ async function addLinting(host, options) {
                 (0, devkit_1.joinPathFragments)(options.appProjectRoot, 'tsconfig.app.json'),
             ],
             unitTestRunner: options.unitTestRunner,
+            eslintFilePatterns: [
+                (0, lint_project_1.mapLintPattern)(options.appProjectRoot, '{ts,tsx,js,jsx}', options.rootProject),
+            ],
             skipFormat: true,
             rootProject: options.rootProject,
             skipPackageJson: options.skipPackageJson,
-            addPlugin: options.addPlugin,
         });
         tasks.push(lintTask);
         if ((0, eslint_file_1.isEslintConfigSupported)(host)) {
@@ -54,7 +53,6 @@ async function addLinting(host, options) {
 }
 async function applicationGenerator(host, schema) {
     return await applicationGeneratorInternal(host, {
-        addPlugin: false,
         projectNameAndRootFormat: 'derived',
         ...schema,
     });
@@ -64,41 +62,17 @@ async function applicationGeneratorInternal(host, schema) {
     const tasks = [];
     const options = await (0, normalize_options_1.normalizeOptions)(host, schema);
     (0, show_possible_warnings_1.showPossibleWarnings)(host, options);
-    const jsInitTask = await (0, js_1.initGenerator)(host, {
-        ...schema,
-        tsConfigName: schema.rootProject ? 'tsconfig.json' : 'tsconfig.base.json',
-        skipFormat: true,
-    });
-    tasks.push(jsInitTask);
     const initTask = await (0, init_1.default)(host, {
         ...options,
         skipFormat: true,
+        skipHelperLibs: options.bundler === 'vite',
     });
     tasks.push(initTask);
-    if (options.bundler === 'webpack') {
-        const { webpackInitGenerator } = (0, devkit_1.ensurePackage)('@nx/webpack', versions_1.nxVersion);
-        const webpackInitTask = await webpackInitGenerator(host, {
-            skipPackageJson: options.skipPackageJson,
-            skipFormat: true,
-            addPlugin: options.addPlugin,
-        });
-        tasks.push(webpackInitTask);
-        if (!options.skipPackageJson) {
-            const { ensureDependencies } = await Promise.resolve().then(() => require('@nx/webpack/src/utils/ensure-dependencies'));
-            tasks.push(ensureDependencies(host, { uiFramework: 'react' }));
-        }
-    }
     if (!options.rootProject) {
         (0, create_ts_config_1.extractTsConfigBase)(host);
     }
     (0, create_application_files_1.createApplicationFiles)(host, options);
     (0, add_project_1.addProject)(host, options);
-    if (options.style === 'tailwind') {
-        const twTask = await (0, setup_tailwind_1.setupTailwindGenerator)(host, {
-            project: options.projectName,
-        });
-        tasks.push(twTask);
-    }
     if (options.bundler === 'vite') {
         const { createOrEditViteConfig, viteConfigurationGenerator } = (0, devkit_1.ensurePackage)('@nx/vite', versions_1.nxVersion);
         // We recommend users use `import.meta.env.MODE` and other variables in their code to differentiate between production and development.
@@ -114,7 +88,6 @@ async function applicationGeneratorInternal(host, schema) {
             inSourceTests: options.inSourceTests,
             compiler: options.compiler,
             skipFormat: true,
-            addPlugin: options.addPlugin,
         });
         tasks.push(viteTask);
         createOrEditViteConfig(host, {
@@ -135,15 +108,23 @@ async function applicationGeneratorInternal(host, schema) {
             plugins: ['react()'],
         }, false);
     }
+    else if (options.bundler === 'webpack') {
+        const { webpackInitGenerator } = (0, devkit_1.ensurePackage)('@nx/webpack', versions_1.nxVersion);
+        const webpackInitTask = await webpackInitGenerator(host, {
+            uiFramework: 'react',
+            skipFormat: true,
+        });
+        tasks.push(webpackInitTask);
+    }
     else if (options.bundler === 'rspack') {
         const { configurationGenerator } = (0, devkit_1.ensurePackage)('@nx/rspack', versions_1.nxRspackVersion);
         const rspackTask = await configurationGenerator(host, {
             project: options.projectName,
-            main: (0, devkit_1.joinPathFragments)(options.appProjectRoot, (0, maybe_js_1.maybeJs)(options, `src/main.tsx`)),
+            main: (0, devkit_1.joinPathFragments)(options.appProjectRoot, (0, add_project_1.maybeJs)(options, `src/main.tsx`)),
             tsConfig: (0, devkit_1.joinPathFragments)(options.appProjectRoot, 'tsconfig.app.json'),
             target: 'web',
             newProject: true,
-            framework: 'react',
+            uiFramework: 'react',
         });
         tasks.push(rspackTask);
     }
@@ -151,11 +132,10 @@ async function applicationGeneratorInternal(host, schema) {
         const { createOrEditViteConfig, vitestGenerator } = (0, devkit_1.ensurePackage)('@nx/vite', versions_1.nxVersion);
         const vitestTask = await vitestGenerator(host, {
             uiFramework: 'react',
-            coverageProvider: 'v8',
+            coverageProvider: 'c8',
             project: options.projectName,
             inSourceTests: options.inSourceTests,
             skipFormat: true,
-            addPlugin: options.addPlugin,
         });
         tasks.push(vitestTask);
         createOrEditViteConfig(host, {
@@ -201,8 +181,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, withReact } = require('@nx/rspack');
-        module.exports = composePlugins(withNx(), withReact(), (config) => {
+        const { composePlugins, withNx, withWeb } = require('@nx/rspack');
+        module.exports = composePlugins(withNx(), withWeb(), (config) => {
           config.module.rules.push({
             test: /\\.[jt]sx$/i,
             use: [
@@ -222,9 +202,6 @@ async function applicationGeneratorInternal(host, schema) {
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(host);
     }
-    tasks.push(() => {
-        (0, log_show_project_command_1.logShowProjectCommand)(options.projectName);
-    });
     return (0, devkit_1.runTasksInSerial)(...tasks);
 }
 exports.applicationGeneratorInternal = applicationGeneratorInternal;

package/src/generators/application/files/base-vite/index.html__tmpl__

@@ -7,7 +7,7 @@
 
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <link rel="icon" type="image/x-icon" href="/favicon.ico" />
-    <% if (!styledModule && style !== 'none') { %><link rel="stylesheet" href="/src/styles.<%= style === 'tailwind' ? 'css' : style %>" /><% } %>
+    <% if (!styledModule && style !== 'none') { %><link rel="stylesheet" href="/src/styles.<%= style %>" /><% } %>
   </head>
   <body>
     <div id="root"></div>

package/src/generators/application/files/base-webpack/src/environments/environment.prod.ts__tmpl__

@@ -0,0 +1,3 @@
+export const environment = {
+  production: true
+};

package/src/generators/application/files/base-webpack/src/environments/environment.ts__tmpl__

@@ -0,0 +1,6 @@
+// This file can be replaced during build by using the `fileReplacements` array.
+// When building for production, this file is replaced with `environment.prod.ts`.
+
+export const environment = {
+  production: false
+};

package/src/generators/application/files/base-webpack/src/index.html

@@ -3,6 +3,8 @@
   <head>
     <meta charset="utf-8" />
     <title><%= className %></title>
+    <base href="/" />
+
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <link rel="icon" type="image/x-icon" href="favicon.ico" />
   </head>

package/src/generators/application/files/base-webpack/webpack.config.js__tmpl__

@@ -1,50 +1,9 @@
-<% if (webpackPluginOptions) { %>
-const { NxWebpackPlugin } = require('@nx/webpack');
-const { NxReactWebpackPlugin } = require('@nx/react');
-const { join } = require('path');
-
-module.exports = {
-  output: {
-    path: join(__dirname, '<%= offsetFromRoot %><%= webpackPluginOptions.outputPath %>'),
-  },
-  devServer: {
-    port: 4200
-  },
-  plugins: [
-    new NxWebpackPlugin({
-      tsConfig: '<%= webpackPluginOptions.tsConfig %>',
-      compiler: '<%= webpackPluginOptions.compiler %>',
-      main: '<%= webpackPluginOptions.main %>',
-      index: '<%= webpackPluginOptions.index %>',
-      baseHref: '<%= webpackPluginOptions.baseHref %>',
-      assets: <%- JSON.stringify(webpackPluginOptions.assets) %>,
-      styles: <%- JSON.stringify(webpackPluginOptions.styles) %>,
-      outputHashing: process.env['NODE_ENV'] === 'production' ? 'all' : 'none',
-      optimization: process.env['NODE_ENV'] === 'production',
-    }),
-    new NxReactWebpackPlugin({
-      // Uncomment this line if you don't want to use SVGR
-      // See: https://react-svgr.com/
-      // svgr: false
-    }),
-  ],
-};
-<% } else { %>
 const { composePlugins, withNx } = require('@nx/webpack');
 const { withReact } = require('@nx/react');
 
 // Nx plugins for webpack.
-module.exports = composePlugins(
-  withNx(),
-  withReact({
-    // Uncomment this line if you don't want to use SVGR
-    // See: https://react-svgr.com/
-    // svgr: false
-  }),
-  (config) => {
-    // Update the webpack config as needed here.
-    // e.g. `config.plugins.push(new MyPlugin())`
-    return config;
-  }
-);
-<% } %>
+module.exports = composePlugins(withNx(), withReact(), (config) => {
+  // Update the webpack config as needed here.
+  // e.g. `config.plugins.push(new MyPlugin())`
+  return config;
+});