@nx/angular 0.0.0-pr-3-8473941 → 0.0.0-pr-29860-74361a9

package/generators.json

@@ -38,6 +38,11 @@
       "schema": "./src/generators/convert-to-application-executor/schema.json",
       "description": "Converts projects to use the `@nx/angular:application` executor or the `@angular-devkit/build-angular:application` builder."
     },
+    "convert-to-rspack": {
+      "factory": "./src/generators/convert-to-rspack/convert-to-rspack",
+      "schema": "./src/generators/convert-to-rspack/schema.json",
+      "description": "Converts Angular Webpack projects to use Rspack."
+    },
     "directive": {
       "factory": "./src/generators/directive/directive",
       "schema": "./src/generators/directive/schema.json",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/angular",
-  "version": "0.0.0-pr-3-8473941",
+  "version": "0.0.0-pr-29860-74361a9",
   "private": false,
   "description": "The Nx Plugin for Angular contains executors, generators, and utilities for managing Angular applications and libraries within an Nx workspace. It provides: \n\n- Integration with libraries such as Storybook, Jest, ESLint, Tailwind CSS, Playwright and Cypress. \n\n- Generators to help scaffold code quickly (like: Micro Frontends, Libraries, both internal to your codebase and publishable to npm) \n\n- Single Component Application Modules (SCAMs) \n\n- NgRx helpers. \n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -71,13 +71,14 @@
     "semver": "^7.5.3",
     "tslib": "^2.3.0",
     "webpack-merge": "^5.8.0",
-    "@nx/devkit": "0.0.0-pr-3-8473941",
-    "@nx/js": "0.0.0-pr-3-8473941",
-    "@nx/eslint": "0.0.0-pr-3-8473941",
-    "@nx/webpack": "0.0.0-pr-3-8473941",
-    "@nx/module-federation": "0.0.0-pr-3-8473941",
-    "@nx/web": "0.0.0-pr-3-8473941",
-    "@nx/workspace": "0.0.0-pr-3-8473941",
+    "@nx/devkit": "0.0.0-pr-29860-74361a9",
+    "@nx/js": "0.0.0-pr-29860-74361a9",
+    "@nx/eslint": "0.0.0-pr-29860-74361a9",
+    "@nx/webpack": "0.0.0-pr-29860-74361a9",
+    "@nx/rspack": "0.0.0-pr-29860-74361a9",
+    "@nx/module-federation": "0.0.0-pr-29860-74361a9",
+    "@nx/web": "0.0.0-pr-29860-74361a9",
+    "@nx/workspace": "0.0.0-pr-29860-74361a9",
     "piscina": "^4.4.0"
   },
   "peerDependencies": {

package/src/builders/dev-server/dev-server.impl.js

@@ -120,7 +120,7 @@ function executeDevServerBuilder(rawOptions, context) {
                     if (workspaceDependencies.length > 0) {
                         baseWebpackConfig.plugins.push(
                         // @ts-expect-error - difference between angular and webpack plugin definitions bc of webpack versions
-                        new webpack_nx_build_coordination_plugin_1.WebpackNxBuildCoordinationPlugin(`nx run-many --target=${parsedBuildTarget.target} --projects=${workspaceDependencies.join(',')}`));
+                        new webpack_nx_build_coordination_plugin_1.WebpackNxBuildCoordinationPlugin(`nx run-many --target=${parsedBuildTarget.target} --projects=${workspaceDependencies.join(',')}`, { skipWatchingDeps: !options.watchDependencies }));
                     }
                 }
                 if (!pathToWebpackConfig) {
@@ -151,6 +151,7 @@ function getDelegateBuilderOptions(options) {
     }
     // delete extra option not supported by the delegate builder
     delete delegateBuilderOptions.buildLibsFromSource;
+    delete delegateBuilderOptions.watchDependencies;
     return delegateBuilderOptions;
 }
 async function loadIndexHtmlFileTransformer(pathToIndexFileTransformer, tsConfig, context, isUsingWebpackBuilder) {

package/src/builders/dev-server/lib/normalize-options.js

@@ -18,5 +18,6 @@ function normalizeOptions(schema) {
         hmr: schema.hmr ?? (angularMajorVersion < 19 ? false : undefined),
         open: schema.open ?? false,
         ssl: schema.ssl ?? false,
+        watchDependencies: schema.watchDependencies ?? true,
     };
 }

package/src/builders/dev-server/schema.d.ts

@@ -21,6 +21,7 @@ interface BaseSchema {
   prebundle?: boolean | { exclude: string[] };
   buildLibsFromSource?: boolean;
   esbuildMiddleware?: string[];
+  watchDependencies?: boolean;
 }
 
 export type SchemaWithBrowserTarget = BaseSchema & {

package/src/builders/dev-server/schema.json

@@ -156,6 +156,11 @@
         "type": "string",
         "description": "The path to the middleware function. Relative to the workspace root."
       }
+    },
+    "watchDependencies": {
+      "type": "boolean",
+      "description": "Watch buildable dependencies and rebuild when they change.",
+      "default": true
     }
   },
   "additionalProperties": false,

package/src/builders/webpack-browser/schema.d.ts

@@ -6,8 +6,10 @@ export type BrowserBuilderSchema = Schema & {
   };
   indexHtmlTransformer?: string;
   buildLibsFromSource?: boolean;
+  watchDependencies?: boolean;
+
   /**
-   * @deprecated Use `indexHtmlTransformer` instead. It will be removed in Nx 20.
+   * @deprecated Use `indexHtmlTransformer` instead. It will be removed in Nx 21.
    */
   indexFileTransformer?: string;
 };

package/src/builders/webpack-browser/schema.json

@@ -464,6 +464,11 @@
       "type": "boolean",
       "description": "Read buildable libraries from source instead of building them separately.",
       "default": true
+    },
+    "watchDependencies": {
+      "type": "boolean",
+      "description": "Watch buildable dependencies and rebuild when they change.",
+      "default": true
     }
   },
   "additionalProperties": false,

package/src/builders/webpack-browser/webpack-browser.impl.js

@@ -25,7 +25,8 @@ function shouldSkipInitialTargetRun(projectGraph, project, target) {
 }
 function executeWebpackBrowserBuilder(options, context) {
     options.buildLibsFromSource ??= true;
-    const { buildLibsFromSource, customWebpackConfig, indexHtmlTransformer, indexFileTransformer, ...delegateBuilderOptions } = options;
+    options.watchDependencies ??= true;
+    const { buildLibsFromSource, customWebpackConfig, indexHtmlTransformer, indexFileTransformer, watchDependencies, ...delegateBuilderOptions } = options;
     process.env.NX_BUILD_LIBS_FROM_SOURCE = `${buildLibsFromSource}`;
     process.env.NX_BUILD_TARGET = (0, devkit_1.targetToTargetString)({ ...context.target });
     const pathToWebpackConfig = customWebpackConfig?.path &&
@@ -61,7 +62,7 @@ function executeWebpackBrowserBuilder(options, context) {
                     const skipInitialRun = shouldSkipInitialTargetRun(projectGraph, context.target.project, context.target.target);
                     baseWebpackConfig.plugins.push(
                     // @ts-expect-error - difference between angular and webpack plugin definitions bc of webpack versions
-                    new webpack_nx_build_coordination_plugin_1.WebpackNxBuildCoordinationPlugin(`nx run-many --target=${context.target.target} --projects=${workspaceDependencies.join(',')}`, skipInitialRun));
+                    new webpack_nx_build_coordination_plugin_1.WebpackNxBuildCoordinationPlugin(`nx run-many --target=${context.target.target} --projects=${workspaceDependencies.join(',')}`, { skipInitialRun, skipWatchingDeps: !watchDependencies }));
                 }
             }
             if (!pathToWebpackConfig) {

package/src/generators/add-linting/add-linting.js

@@ -61,21 +61,6 @@ async function addLintingGenerator(tree, options) {
                 files: ['*.html'],
                 rules: {},
             });
-            if ((0, buildable_project_1.isBuildableLibraryProject)(tree, options.projectName)) {
-                (0, eslint_file_1.addOverrideToLintConfig)(tree, '', {
-                    files: ['*.json'],
-                    parser: 'jsonc-eslint-parser',
-                    rules: {
-                        '@nx/dependency-checks': [
-                            'error',
-                            {
-                                // With flat configs, we don't want to include imports in the eslint js/cjs/mjs files to be checked
-                                ignoredFiles: ['{projectRoot}/eslint.config.{js,cjs,mjs}'],
-                            },
-                        ],
-                    },
-                });
-            }
         }
         else {
             (0, eslint_file_1.replaceOverridesInLintConfig)(tree, options.projectRoot, [

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

@@ -0,0 +1,4 @@
+import { type Tree, GeneratorCallback } from '@nx/devkit';
+import type { ConvertToRspackSchema } from './schema';
+export declare function convertToRspack(tree: Tree, schema: ConvertToRspackSchema): Promise<GeneratorCallback>;
+export default convertToRspack;

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

@@ -0,0 +1,72 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.convertToRspack = convertToRspack;
+const devkit_1 = require("@nx/devkit");
+const versions_1 = require("../../utils/versions");
+const create_config_1 = require("./lib/create-config");
+const get_custom_webpack_config_1 = require("./lib/get-custom-webpack-config");
+async function convertToRspack(tree, schema) {
+    const { project: projectName } = schema;
+    const project = (0, devkit_1.readProjectConfiguration)(tree, projectName);
+    const tasks = [];
+    const createConfigOptions = {
+        root: project.root,
+    };
+    const buildAndServeTargetNames = [];
+    let customWebpackConfigPath;
+    for (const [targetName, target] of Object.entries(project.targets)) {
+        if (target.executor === '@angular-devkit/build-angular:browser' ||
+            target.executor === '@nx/angular:webpack-browser') {
+            createConfigOptions.browser = target.options.main;
+            createConfigOptions.index = target.options.index;
+            createConfigOptions.assets = target.options.assets.map((asset) => {
+                if (typeof asset === 'string') {
+                    return asset;
+                }
+                return asset.input;
+            });
+            createConfigOptions.styles = target.options.styles;
+            createConfigOptions.scripts = target.options.scripts;
+            createConfigOptions.polyfills = target.options.polyfills;
+            createConfigOptions.tsconfigPath = target.options.tsConfig;
+            createConfigOptions.jit =
+                target.options.aot === undefined ? false : !target.options.aot;
+            createConfigOptions.inlineStylesExtension =
+                target.options.inlineStyleLanguage === undefined
+                    ? 'css'
+                    : target.options.inlineStyleLanguage;
+            if (target.options.customWebpackConfig) {
+                customWebpackConfigPath = target.options.customWebpackConfig.path;
+            }
+            // TODO: Add more options that can be correctly mapped
+            buildAndServeTargetNames.push(targetName);
+        }
+        else if (target.executor === '@angular-devkit/build-angular:dev-server' ||
+            target.executor === '@nx/angular:dev-server') {
+            buildAndServeTargetNames.push(targetName);
+        }
+    }
+    const customWebpackConfigInfo = customWebpackConfigPath
+        ? await (0, get_custom_webpack_config_1.getCustomWebpackConfig)(tree, project.root, customWebpackConfigPath)
+        : undefined;
+    (0, create_config_1.createConfig)(tree, createConfigOptions, customWebpackConfigInfo?.normalizedPathToCustomWebpackConfig, customWebpackConfigInfo?.isWebpackConfigFunction);
+    for (const targetName of buildAndServeTargetNames) {
+        delete project.targets[targetName];
+    }
+    (0, devkit_1.updateProjectConfiguration)(tree, projectName, project);
+    const { rspackInitGenerator } = (0, devkit_1.ensurePackage)('@nx/rspack', versions_1.nxVersion);
+    await rspackInitGenerator(tree, {
+        addPlugin: true,
+    });
+    if (!schema.skipInstall) {
+        const installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, {
+            '@ng-rspack/build': versions_1.ngRspackVersion,
+        });
+        tasks.push(installTask);
+    }
+    if (!schema.skipFormat) {
+        await (0, devkit_1.formatFiles)(tree);
+    }
+    return (0, devkit_1.runTasksInSerial)(...tasks);
+}
+exports.default = convertToRspack;

package/src/generators/convert-to-rspack/lib/create-config.d.ts

@@ -0,0 +1,17 @@
+import { type Tree } from '@nx/devkit';
+export interface CreateConfigOptions {
+    root: string;
+    index: string;
+    browser: string;
+    server?: string;
+    ssrEntry?: string;
+    polyfills: string[];
+    tsconfigPath: string;
+    assets: string[];
+    styles: string[];
+    scripts: string[];
+    jit?: boolean;
+    inlineStylesExtension?: string;
+    fileReplacements?: string[];
+}
+export declare function createConfig(tree: Tree, opts: Partial<CreateConfigOptions>, existingWebpackConfigPath?: string, isExistingWebpackConfigFunction?: boolean): void;

package/src/generators/convert-to-rspack/lib/create-config.js

@@ -0,0 +1,63 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createConfig = createConfig;
+const devkit_1 = require("@nx/devkit");
+function createConfig(tree, opts, existingWebpackConfigPath, isExistingWebpackConfigFunction) {
+    const configContents = `const { createConfig } = require('@ng-rspack/build');
+  ${existingWebpackConfigPath
+        ? `const baseWebpackConfig = require('${existingWebpackConfigPath}');
+      ${isExistingWebpackConfigFunction
+            ? ''
+            : `const webpackMerge = require('webpack-merge');`}`
+        : ''}
+  
+  ${existingWebpackConfigPath ? 'const baseConfig' : 'module.exports'} = createConfig({
+    root: __dirname,
+    index: '${normalizeFromProjectRoot(opts.index, opts.root)}',
+    browser: '${normalizeFromProjectRoot(opts.browser, opts.root)}',
+    ${opts.server
+        ? `server: '${normalizeFromProjectRoot(opts.server, opts.root)}',`
+        : ''}
+    ${opts.ssrEntry
+        ? `ssrEntry: '${normalizeFromProjectRoot(opts.ssrEntry, opts.root)}',`
+        : ''}
+    tsconfigPath: '${normalizeFromProjectRoot(opts.tsconfigPath, opts.root)}',
+    polyfills: ${JSON.stringify(opts.polyfills)},
+    assets: ${JSON.stringify(opts.assets.map((a) => normalizeFromProjectRoot(a, opts.root)))},
+    styles: ${JSON.stringify(opts.styles.map((s) => normalizeFromProjectRoot(s, opts.root)))},
+    scripts: ${JSON.stringify(opts.scripts.map((s) => normalizeFromProjectRoot(s, opts.root)))},
+    jit: ${opts.jit},
+    ${opts.inlineStylesExtension
+        ? `inlineStylesExtension: '${opts.inlineStylesExtension}'`
+        : ''},
+    fileReplacements: ${JSON.stringify(opts.fileReplacements ?? [])},
+    hasServer: ${opts.server || opts.ssrEntry ? true : false},
+    skipTypeChecking: false,
+  });
+  ${existingWebpackConfigPath
+        ? `
+    module.exports = ${isExistingWebpackConfigFunction
+            ? 'baseWebpackConfig(baseConfig)'
+            : 'webpackMerge(baseConfig, baseWebpackConfig)'}
+  `
+        : ''}
+  `;
+    tree.write((0, devkit_1.joinPathFragments)(opts.root, 'rspack.config.ts'), configContents);
+}
+function normalizeFromProjectRoot(path, projectRoot) {
+    if (projectRoot === '.') {
+        if (!path.startsWith('./')) {
+            return `./${path}`;
+        }
+        else {
+            return path;
+        }
+    }
+    else if (path.startsWith(projectRoot)) {
+        return path.replace(projectRoot, '.');
+    }
+    else if (!path.startsWith('./')) {
+        return `./${path}`;
+    }
+    return path;
+}

package/src/generators/convert-to-rspack/lib/get-custom-webpack-config.d.ts

@@ -0,0 +1,5 @@
+import { Tree } from '@nx/devkit';
+export declare function getCustomWebpackConfig(tree: Tree, projectRoot: string, pathToCustomWebpackConfig: string): Promise<{
+    isWebpackConfigFunction: boolean;
+    normalizedPathToCustomWebpackConfig: string;
+}>;

package/src/generators/convert-to-rspack/lib/get-custom-webpack-config.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getCustomWebpackConfig = getCustomWebpackConfig;
+const config_utils_1 = require("@nx/devkit/src/utils/config-utils");
+const path_1 = require("path");
+const FILE_EXTENSION_REGEX = /\.[^.]+$/;
+async function getCustomWebpackConfig(tree, projectRoot, pathToCustomWebpackConfig) {
+    const configFile = await (0, config_utils_1.loadConfigFile)((0, path_1.join)(tree.root, pathToCustomWebpackConfig));
+    const webpackConfig = 'default' in configFile ? configFile.default : configFile;
+    return {
+        isWebpackConfigFunction: typeof webpackConfig === 'function',
+        normalizedPathToCustomWebpackConfig: `./${(0, path_1.relative)(projectRoot, pathToCustomWebpackConfig).replace(FILE_EXTENSION_REGEX, '')}`,
+    };
+}

package/src/generators/convert-to-rspack/schema.d.ts

@@ -0,0 +1,5 @@
+export interface ConvertToRspackSchema {
+  project: string;
+  skipFormat?: boolean;
+  skipInstall?: boolean;
+}

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

@@ -0,0 +1,32 @@
+{
+  "$schema": "https://json-schema.org/schema",
+  "$id": "GeneratorNxApp",
+  "title": "Creates an Angular application.",
+  "description": "Creates an Angular application.",
+  "type": "object",
+  "cli": "nx",
+  "properties": {
+    "project": {
+      "type": "string",
+      "aliases": ["name", "projectName"],
+      "description": "Project for which to convert to rspack.",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      },
+      "x-prompt": "Which project do you want to convert to rspack?",
+      "x-dropdown": "projects",
+      "x-priority": "important"
+    },
+    "skipFormat": {
+      "description": "Skip formatting files.",
+      "type": "boolean",
+      "default": false
+    },
+    "skipInstall": {
+      "description": "Skip installing dependencies.",
+      "type": "boolean",
+      "default": false
+    }
+  }
+}

package/src/utils/backward-compatible-versions.js

@@ -6,6 +6,7 @@ exports.backwardCompatibleVersions = {
         angularVersion: '~17.3.0',
         angularDevkitVersion: '~17.3.0',
         ngPackagrVersion: '~17.3.0',
+        ngRspackVersion: '~19.0.0-alpha.26',
         ngrxVersion: '~17.0.0',
         rxjsVersion: '~7.8.0',
         zoneJsVersion: '~0.14.3',
@@ -33,6 +34,7 @@ exports.backwardCompatibleVersions = {
         angularVersion: '~18.2.0',
         angularDevkitVersion: '~18.2.0',
         ngPackagrVersion: '~18.2.0',
+        ngRspackVersion: '~19.0.0-alpha.26',
         ngrxVersion: '~18.0.2',
         rxjsVersion: '~7.8.0',
         zoneJsVersion: '~0.14.3',

package/src/utils/versions.d.ts

@@ -2,6 +2,7 @@ export declare const nxVersion: any;
 export declare const angularVersion = "~19.1.0";
 export declare const angularDevkitVersion = "~19.1.0";
 export declare const ngPackagrVersion = "~19.1.0";
+export declare const ngRspackVersion = "~19.0.0-alpha.26";
 export declare const ngrxVersion = "^19.0.0";
 export declare const rxjsVersion = "~7.8.0";
 export declare const zoneJsVersion = "~0.15.0";

package/src/utils/versions.js

@@ -1,10 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.jsoncEslintParserVersion = exports.jasmineMarblesVersion = exports.typesNodeVersion = exports.jestPresetAngularVersion = exports.tsNodeVersion = exports.autoprefixerVersion = exports.postcssUrlVersion = exports.postcssVersion = exports.tailwindVersion = exports.typescriptEslintVersion = exports.angularEslintVersion = exports.moduleFederationEnhancedVersion = exports.moduleFederationNodeVersion = exports.browserSyncVersion = exports.typesExpressVersion = exports.expressVersion = exports.typesCorsVersion = exports.corsVersion = exports.tsLibVersion = exports.angularJsVersion = exports.zoneJsVersion = exports.rxjsVersion = exports.ngrxVersion = exports.ngPackagrVersion = exports.angularDevkitVersion = exports.angularVersion = exports.nxVersion = void 0;
+exports.jsoncEslintParserVersion = exports.jasmineMarblesVersion = exports.typesNodeVersion = exports.jestPresetAngularVersion = exports.tsNodeVersion = exports.autoprefixerVersion = exports.postcssUrlVersion = exports.postcssVersion = exports.tailwindVersion = exports.typescriptEslintVersion = exports.angularEslintVersion = exports.moduleFederationEnhancedVersion = exports.moduleFederationNodeVersion = exports.browserSyncVersion = exports.typesExpressVersion = exports.expressVersion = exports.typesCorsVersion = exports.corsVersion = exports.tsLibVersion = exports.angularJsVersion = exports.zoneJsVersion = exports.rxjsVersion = exports.ngrxVersion = exports.ngRspackVersion = exports.ngPackagrVersion = exports.angularDevkitVersion = exports.angularVersion = exports.nxVersion = void 0;
 exports.nxVersion = require('../../package.json').version;
 exports.angularVersion = '~19.1.0';
 exports.angularDevkitVersion = '~19.1.0';
 exports.ngPackagrVersion = '~19.1.0';
+exports.ngRspackVersion = '~19.0.0-alpha.26';
 exports.ngrxVersion = '^19.0.0';
 exports.rxjsVersion = '~7.8.0';
 exports.zoneJsVersion = '~0.15.0';