@nx/rspack 20.2.0-beta.2 → 20.2.0-beta.4

package/src/generators/convert-config-to-rspack-plugin/lib/validate-project.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateProject = validateProject;
+function hasAnotherRspackConfig(tree, projectRoot) {
+    const files = tree.children(projectRoot);
+    const projectJsonString = tree.read(`${projectRoot}/project.json`, 'utf-8');
+    for (const file of files) {
+        if (file !== 'rspack.config.js' &&
+            file.endsWith('.js') &&
+            file.includes('rspack.config') &&
+            projectJsonString.includes(file) &&
+            tree.exists(`${projectRoot}/rspack.config.js`)) {
+            return 'Cannot convert a project with multiple rspack config files. Please consolidate them into a single rspack.config.js file.';
+        }
+    }
+}
+function isNestProject(project) {
+    for (const target in project.targets) {
+        if (project.targets[target].executor === '@nx/js:node') {
+            return `The project ${project.name} is using the '@nx/js:node' executor. At the moment, we do not support migrating such projects.`;
+        }
+    }
+}
+/**
+ * Validates the project to ensure it can be migrated
+ *
+ * @param tree The virtual file system
+ * @param project the project configuration object for the project
+ * @returns A string if there is an error, otherwise undefined
+ */
+function validateProject(tree, project) {
+    const containsMfeExecutor = Object.keys(project.targets).some((target) => {
+        return ['@nx/rspack:module-federation-dev-server'].includes(project.targets[target].executor);
+    });
+    if (containsMfeExecutor) {
+        return `The project ${project.name} is using Module Federation. At the moment, we don't support migrating projects that use Module Federation.`;
+    }
+    const hasAnotherConfig = hasAnotherRspackConfig(tree, project.root);
+    return hasAnotherConfig || isNestProject(project);
+}

package/src/generators/convert-config-to-rspack-plugin/schema.json

@@ -0,0 +1,19 @@
+{
+  "$schema": "https://json-schema.org/schema",
+  "$id": "NxRspackConvertConfigToRspackPlugin",
+  "description": "Convert existing Rspack project(s) using `@nx/rspack:rspack` executor that uses `withNx` to use `NxAppRspackPlugin`. Defaults to migrating all projects. Pass '--project' to migrate only one target.",
+  "title": "Convert Rspack project using withNx to NxAppRspackPlugin",
+  "type": "object",
+  "properties": {
+    "project": {
+      "type": "string",
+      "description": "The project to convert from using the `@nx/rspack:rspack` executor and `withNx` plugin to use `NxAppRspackPlugin`.",
+      "x-priority": "important"
+    },
+    "skipFormat": {
+      "type": "boolean",
+      "description": "Whether to format files at the end of the migration.",
+      "default": false
+    }
+  }
+}

package/src/generators/convert-to-inferred/__snapshots__/convert-to-inferred.spec.ts.snap

@@ -0,0 +1,268 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`convert-to-inferred all projects should migrate all projects using the rspack executors 1`] = `
+"const { NxAppRspackPlugin } = require('@nx/rspack/app-plugin');
+const { NxReactRspackPlugin } = require('@nx/rspack/react-plugin');
+const { useLegacyNxPlugin } = require('@nx/rspack');
+
+// These options were migrated by @nx/rspack:convert-to-inferred from
+// the project.json file and merged with the options in this file
+const configValues = {
+  build: {
+    default: {
+      outputPath: '../../dist/apps/app1',
+      index: './src/index.html',
+      main: './src/main.tsx',
+      tsConfig: './tsconfig.app.json',
+      assets: ['./src/favicon.ico', './src/assets'],
+      styles: ['./src/styles.scss'],
+    },
+    development: {
+      extractLicenses: false,
+      optimization: false,
+      sourceMap: true,
+      vendorChunk: true,
+    },
+    production: {
+      fileReplacements: [
+        {
+          replace: './src/environments/environment.ts',
+          with: './src/environments/environment.prod.ts',
+        },
+      ],
+      optimization: true,
+      outputHashing: 'all',
+      sourceMap: false,
+      namedChunks: false,
+      extractLicenses: true,
+      vendorChunk: false,
+    },
+  },
+  serve: {
+    default: {
+      hmr: true,
+      server: {
+        type: 'https',
+        options: { cert: './server.crt', key: './server.key' },
+      },
+      port: 4200,
+      headers: { 'Access-Control-Allow-Origin': '*' },
+      historyApiFallback: {
+        index: '/index.html',
+        disableDotRule: true,
+        htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'],
+      },
+    },
+    development: { open: true },
+    production: { hmr: false },
+  },
+};
+
+// Determine the correct configValue to use based on the configuration
+const configuration = process.env.NX_TASK_TARGET_CONFIGURATION || 'default';
+
+const buildOptions = {
+  ...configValues.build.default,
+  ...configValues.build[configuration],
+};
+const devServerOptions = {
+  ...configValues.serve.default,
+  ...configValues.serve[configuration],
+};
+
+/**
+ * @type{import('@rspack/core').RspackOptionsNormalized}
+ */
+module.exports = async () => ({
+  devServer: devServerOptions,
+  plugins: [
+    new NxAppRspackPlugin(buildOptions),
+    new NxReactRspackPlugin({
+      // Uncomment this line if you don't want to use SVGR
+      // See: https://react-svgr.com/
+      // svgr: false
+    }),
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    await useLegacyNxPlugin(require('./rspack.config.old'), buildOptions),
+  ],
+});
+"
+`;
+
+exports[`convert-to-inferred all projects should migrate all projects using the rspack executors 2`] = `
+"const { NxAppRspackPlugin } = require('@nx/rspack/app-plugin');
+const { NxReactRspackPlugin } = require('@nx/rspack/react-plugin');
+const { useLegacyNxPlugin } = require('@nx/rspack');
+
+// These options were migrated by @nx/rspack:convert-to-inferred from
+// the project.json file and merged with the options in this file
+const configValues = {
+  build: {
+    default: {
+      outputPath: '../../dist/apps/app2',
+      index: './src/index.html',
+      main: './src/main.tsx',
+      tsConfig: './tsconfig.app.json',
+      assets: ['./src/favicon.ico', './src/assets'],
+      styles: ['./src/styles.scss'],
+    },
+    development: {
+      extractLicenses: false,
+      optimization: false,
+      sourceMap: true,
+      vendorChunk: true,
+    },
+    production: {
+      fileReplacements: [
+        {
+          replace: './src/environments/environment.ts',
+          with: './src/environments/environment.prod.ts',
+        },
+      ],
+      optimization: true,
+      outputHashing: 'all',
+      sourceMap: false,
+      namedChunks: false,
+      extractLicenses: true,
+      vendorChunk: false,
+    },
+  },
+  serve: {
+    default: {
+      hmr: true,
+      server: {
+        type: 'https',
+        options: { cert: './server.crt', key: './server.key' },
+      },
+      port: 4200,
+      headers: { 'Access-Control-Allow-Origin': '*' },
+      historyApiFallback: {
+        index: '/index.html',
+        disableDotRule: true,
+        htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'],
+      },
+    },
+    development: { open: true },
+    production: { hmr: false },
+  },
+};
+
+// Determine the correct configValue to use based on the configuration
+const configuration = process.env.NX_TASK_TARGET_CONFIGURATION || 'default';
+
+const buildOptions = {
+  ...configValues.build.default,
+  ...configValues.build[configuration],
+};
+const devServerOptions = {
+  ...configValues.serve.default,
+  ...configValues.serve[configuration],
+};
+
+/**
+ * @type{import('@rspack/core').RspackOptionsNormalized}
+ */
+module.exports = async () => ({
+  devServer: devServerOptions,
+  plugins: [
+    new NxAppRspackPlugin(buildOptions),
+    new NxReactRspackPlugin({
+      // Uncomment this line if you don't want to use SVGR
+      // See: https://react-svgr.com/
+      // svgr: false
+    }),
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    await useLegacyNxPlugin(require('./rspack.config.old'), buildOptions),
+  ],
+});
+"
+`;
+
+exports[`convert-to-inferred all projects should migrate all projects using the rspack executors 3`] = `
+"const { NxAppRspackPlugin } = require('@nx/rspack/app-plugin');
+const { NxReactRspackPlugin } = require('@nx/rspack/react-plugin');
+const { useLegacyNxPlugin } = require('@nx/rspack');
+
+// These options were migrated by @nx/rspack:convert-to-inferred from
+// the project.json file and merged with the options in this file
+const configValues = {
+  build: {
+    default: {
+      outputPath: '../../dist/apps/app3',
+      index: './src/index.html',
+      main: './src/main.tsx',
+      tsConfig: './tsconfig.app.json',
+      assets: ['./src/favicon.ico', './src/assets'],
+      styles: ['./src/styles.scss'],
+    },
+    development: {
+      extractLicenses: false,
+      optimization: false,
+      sourceMap: true,
+      vendorChunk: true,
+    },
+    production: {
+      fileReplacements: [
+        {
+          replace: './src/environments/environment.ts',
+          with: './src/environments/environment.prod.ts',
+        },
+      ],
+      optimization: true,
+      outputHashing: 'all',
+      sourceMap: false,
+      namedChunks: false,
+      extractLicenses: true,
+      vendorChunk: false,
+    },
+  },
+  serve: {
+    default: {
+      hmr: true,
+      server: {
+        type: 'https',
+        options: { cert: './server.crt', key: './server.key' },
+      },
+      port: 4200,
+      headers: { 'Access-Control-Allow-Origin': '*' },
+      historyApiFallback: {
+        index: '/index.html',
+        disableDotRule: true,
+        htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'],
+      },
+    },
+    development: { open: true },
+    production: { hmr: false },
+  },
+};
+
+// Determine the correct configValue to use based on the configuration
+const configuration = process.env.NX_TASK_TARGET_CONFIGURATION || 'default';
+
+const buildOptions = {
+  ...configValues.build.default,
+  ...configValues.build[configuration],
+};
+const devServerOptions = {
+  ...configValues.serve.default,
+  ...configValues.serve[configuration],
+};
+
+/**
+ * @type{import('@rspack/core').RspackOptionsNormalized}
+ */
+module.exports = async () => ({
+  devServer: devServerOptions,
+  plugins: [
+    new NxAppRspackPlugin(buildOptions),
+    new NxReactRspackPlugin({
+      // Uncomment this line if you don't want to use SVGR
+      // See: https://react-svgr.com/
+      // svgr: false
+    }),
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    await useLegacyNxPlugin(require('./rspack.config.old'), buildOptions),
+  ],
+});
+"
+`;

package/src/generators/convert-to-inferred/convert-to-inferred.d.ts

@@ -0,0 +1,12 @@
+import { type Tree } from '@nx/devkit';
+import { logger as devkitLogger } from 'nx/src/devkit-exports';
+interface Schema {
+    project?: string;
+    skipFormat?: boolean;
+}
+export declare function convertToInferred(tree: Tree, options: Schema): Promise<import("@nx/devkit").GeneratorCallback>;
+export declare function createCollectingLogger(): typeof devkitLogger & {
+    loggedMessages: Map<string, string[]>;
+    flushLogs: (filter?: (message: string) => boolean) => void;
+};
+export {};

package/src/generators/convert-to-inferred/convert-to-inferred.js

@@ -0,0 +1,114 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.convertToInferred = convertToInferred;
+exports.createCollectingLogger = createCollectingLogger;
+const devkit_1 = require("@nx/devkit");
+const aggregate_log_util_1 = require("@nx/devkit/src/generators/plugin-migrations/aggregate-log-util");
+const executor_to_plugin_migrator_1 = require("@nx/devkit/src/generators/plugin-migrations/executor-to-plugin-migrator");
+const tsquery_1 = require("@phenomnomnominal/tsquery");
+const plugin_1 = require("../../plugins/plugin");
+const versions_1 = require("../../utils/versions");
+const utils_1 = require("./utils");
+const devkit_exports_1 = require("nx/src/devkit-exports");
+async function convertToInferred(tree, options) {
+    const projectGraph = await (0, devkit_1.createProjectGraphAsync)();
+    const migrationContext = {
+        logger: new aggregate_log_util_1.AggregatedLog(),
+        projectGraph,
+        workspaceRoot: tree.root,
+    };
+    const logger = createCollectingLogger();
+    const migratedProjects = await (0, executor_to_plugin_migrator_1.migrateProjectExecutorsToPlugin)(tree, projectGraph, '@nx/rspack/plugin', plugin_1.createNodesV2, {
+        buildTargetName: 'build',
+        previewTargetName: 'preview',
+        serveStaticTargetName: 'serve-static',
+        serveTargetName: 'serve',
+    }, [
+        {
+            executors: ['@nx/rspack:rspack', '@nrwl/rspack:rspack'],
+            postTargetTransformer: (0, utils_1.buildPostTargetTransformerFactory)(migrationContext),
+            targetPluginOptionMapper: (target) => ({ buildTargetName: target }),
+            skipProjectFilter: skipProjectFilterFactory(tree),
+        },
+        {
+            executors: ['@nx/rspack:dev-server', '@nrwl/rspack:dev-server'],
+            postTargetTransformer: (0, utils_1.servePostTargetTransformerFactory)(migrationContext),
+            targetPluginOptionMapper: (target) => ({ serveTargetName: target }),
+            skipProjectFilter: skipProjectFilterFactory(tree),
+        },
+    ], options.project, logger);
+    if (migratedProjects.size === 0) {
+        const convertMessage = [...logger.loggedMessages.values()]
+            .flat()
+            .find((v) => v.includes('@nx/rspack:convert-config-to-rspack-plugin'));
+        if (convertMessage.length > 0) {
+            logger.flushLogs((message) => !convertMessage.includes(message));
+            throw new Error(convertMessage);
+        }
+        else {
+            logger.flushLogs();
+            throw new executor_to_plugin_migrator_1.NoTargetsToMigrateError();
+        }
+    }
+    else {
+        logger.flushLogs();
+    }
+    const installCallback = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, { '@rspack/core': versions_1.rspackCoreVersion }, undefined, true);
+    if (!options.skipFormat) {
+        await (0, devkit_1.formatFiles)(tree);
+    }
+    return (0, devkit_1.runTasksInSerial)(installCallback, () => {
+        migrationContext.logger.flushLogs();
+    });
+}
+function skipProjectFilterFactory(tree) {
+    return function skipProjectFilter(projectConfiguration) {
+        const buildTarget = Object.values(projectConfiguration.targets).find((target) => target.executor === '@nx/rspack:rspack' ||
+            target.executor === '@nrwl/rspack:rspack');
+        // the projects for which this is called are guaranteed to have a build target
+        const rspackConfigPath = buildTarget.options.rspackConfig;
+        if (!rspackConfigPath) {
+            return `The rspack config path is missing in the project configuration (${projectConfiguration.root}).`;
+        }
+        const sourceFile = tsquery_1.tsquery.ast(tree.read(rspackConfigPath, 'utf-8'));
+        const composePluginsSelector = 'CallExpression:has(Identifier[name=composePlugins])';
+        const composePlugins = (0, tsquery_1.tsquery)(sourceFile, composePluginsSelector)[0];
+        if (composePlugins) {
+            return `The rspack config (${rspackConfigPath}) can only work with the  "@nx/rspack:rspack" executor. Run the "@nx/rspack:convert-config-to-rspack-plugin" generator first.`;
+        }
+        const nxAppRspackPluginSelector = 'PropertyAssignment:has(Identifier[name=plugins]) NewExpression:has(Identifier[name=NxAppRspackPlugin])';
+        const nxAppRspackPlugin = (0, tsquery_1.tsquery)(sourceFile, nxAppRspackPluginSelector)[0];
+        if (!nxAppRspackPlugin) {
+            return `No "NxAppRspackPlugin" found in the rspack config (${rspackConfigPath}). Its usage is required for the migration to work.`;
+        }
+        return false;
+    };
+}
+function createCollectingLogger() {
+    const loggedMessages = new Map();
+    const flushLogs = (filter) => {
+        loggedMessages.forEach((messages, method) => {
+            messages.forEach((message) => {
+                if (!filter || filter(message)) {
+                    devkit_exports_1.logger[method](message);
+                }
+            });
+        });
+    };
+    return new Proxy({ ...devkit_exports_1.logger, loggedMessages, flushLogs }, {
+        get(target, property) {
+            const originalMethod = target[property];
+            if (typeof originalMethod === 'function') {
+                return (...args) => {
+                    const message = args.join(' ');
+                    const propertyString = String(property);
+                    if (!loggedMessages.has(message)) {
+                        loggedMessages.set(propertyString, []);
+                    }
+                    loggedMessages.get(propertyString).push(message);
+                };
+            }
+            return originalMethod;
+        },
+    });
+}

package/src/generators/convert-to-inferred/schema.json

@@ -0,0 +1,19 @@
+{
+  "$schema": "https://json-schema.org/schema",
+  "$id": "NxWebpackConvertToInferred",
+  "description": "Convert existing Webpack project(s) using `@nx/webpack:wepack` executor to use `@nx/webpack/plugin`.",
+  "title": "Convert a Webpack project from executor to plugin",
+  "type": "object",
+  "properties": {
+    "project": {
+      "type": "string",
+      "description": "The project to convert from using the `@nx/webpack:webpack` executor to use `@nx/webpack/plugin`. If not provided, all projects using the `@nx/webpack:webpack` executor will be converted.",
+      "x-priority": "important"
+    },
+    "skipFormat": {
+      "type": "boolean",
+      "description": "Whether to format files.",
+      "default": false
+    }
+  }
+}

package/src/generators/convert-to-inferred/utils/ast.d.ts

@@ -0,0 +1,3 @@
+import * as ts from 'typescript';
+export declare function toPropertyAssignment(key: string, value: unknown): ts.PropertyAssignment;
+export declare function toExpression(value: unknown): ts.Expression;

package/src/generators/convert-to-inferred/utils/ast.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toPropertyAssignment = toPropertyAssignment;
+exports.toExpression = toExpression;
+const tslib_1 = require("tslib");
+const ts = tslib_1.__importStar(require("typescript"));
+function toPropertyAssignment(key, value) {
+    if (typeof value === 'string') {
+        return ts.factory.createPropertyAssignment(ts.factory.createStringLiteral(key), ts.factory.createStringLiteral(value));
+    }
+    else if (typeof value === 'number') {
+        return ts.factory.createPropertyAssignment(ts.factory.createStringLiteral(key), ts.factory.createNumericLiteral(value));
+    }
+    else if (typeof value === 'boolean') {
+        return ts.factory.createPropertyAssignment(ts.factory.createStringLiteral(key), value ? ts.factory.createTrue() : ts.factory.createFalse());
+    }
+    else if (Array.isArray(value)) {
+        return ts.factory.createPropertyAssignment(ts.factory.createStringLiteral(key), ts.factory.createArrayLiteralExpression(value.map((item) => toExpression(item))));
+    }
+    else {
+        return ts.factory.createPropertyAssignment(ts.factory.createStringLiteral(key), ts.factory.createObjectLiteralExpression(Object.entries(value).map(([key, value]) => toPropertyAssignment(key, value))));
+    }
+}
+function toExpression(value) {
+    if (typeof value === 'string') {
+        return ts.factory.createStringLiteral(value);
+    }
+    else if (typeof value === 'number') {
+        return ts.factory.createNumericLiteral(value);
+    }
+    else if (typeof value === 'boolean') {
+        return value ? ts.factory.createTrue() : ts.factory.createFalse();
+    }
+    else if (Array.isArray(value)) {
+        return ts.factory.createArrayLiteralExpression(value.map((item) => toExpression(item)));
+    }
+    else {
+        return ts.factory.createObjectLiteralExpression(Object.entries(value).map(([key, value]) => toPropertyAssignment(key, value)));
+    }
+}

package/src/generators/convert-to-inferred/utils/build-post-target-transformer.d.ts

@@ -0,0 +1,6 @@
+import type { TargetConfiguration, Tree } from '@nx/devkit';
+import type { MigrationContext } from './types';
+export declare function buildPostTargetTransformerFactory(migrationContext: MigrationContext): (target: TargetConfiguration, tree: Tree, projectDetails: {
+    projectName: string;
+    root: string;
+}, inferredTarget: TargetConfiguration) => TargetConfiguration;