@nx/angular 17.2.0-beta.11 → 17.2.0-beta.14

package/executors.d.ts

@@ -6,6 +6,7 @@ export * from './src/executors/delegate-build/delegate-build.impl';
 export * from './src/executors/ng-packagr-lite/ng-packagr-lite.impl';
 export * from './src/executors/package/package.impl';
 export * from './src/executors/browser-esbuild/browser-esbuild.impl';
+export * from './src/executors/application/application.impl';
 import { executeDevServerBuilder } from './src/builders/dev-server/dev-server.impl';
 export { 
 /**

package/executors.js

@@ -10,6 +10,7 @@ tslib_1.__exportStar(require("./src/executors/delegate-build/delegate-build.impl
 tslib_1.__exportStar(require("./src/executors/ng-packagr-lite/ng-packagr-lite.impl"), exports);
 tslib_1.__exportStar(require("./src/executors/package/package.impl"), exports);
 tslib_1.__exportStar(require("./src/executors/browser-esbuild/browser-esbuild.impl"), exports);
+tslib_1.__exportStar(require("./src/executors/application/application.impl"), exports);
 const dev_server_impl_1 = require("./src/builders/dev-server/dev-server.impl");
 Object.defineProperty(exports, "executeWebpackDevServerBuilder", { enumerable: true, get: function () { return dev_server_impl_1.executeDevServerBuilder; } });
 Object.defineProperty(exports, "executeDevServerBuilder", { enumerable: true, get: function () { return dev_server_impl_1.executeDevServerBuilder; } });

package/executors.json

@@ -24,6 +24,11 @@
       "implementation": "./src/executors/module-federation-dev-server/module-federation-dev-server.impl",
       "schema": "./src/executors/module-federation-dev-server/schema.json",
       "description": "The module-federation-dev-server executor is reserved exclusively for use with host Module Federation applications. It allows the user to specify which remote applications should be served with the host."
+    },
+    "application": {
+      "implementation": "./src/executors/application/application.impl",
+      "schema": "./src/executors/application/schema.json",
+      "description": "Builds an application with esbuild with support for incremental builds. _Note: this is only supported in Angular versions >= 17.0.0_."
     }
   },
   "builders": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/angular",
-  "version": "17.2.0-beta.11",
+  "version": "17.2.0-beta.14",
   "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, 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- Upgrading AngularJS applications \n\n- Single Component Application Modules (SCAMs) \n\n- NgRx helpers. \n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -78,15 +78,15 @@
     "tslib": "^2.3.0",
     "webpack": "^5.80.0",
     "webpack-merge": "^5.8.0",
-    "@nx/devkit": "17.2.0-beta.11",
-    "@nx/cypress": "17.2.0-beta.11",
-    "@nx/jest": "17.2.0-beta.11",
-    "@nx/js": "17.2.0-beta.11",
-    "@nx/eslint": "17.2.0-beta.11",
-    "@nx/webpack": "17.2.0-beta.11",
-    "@nx/web": "17.2.0-beta.11",
-    "@nx/workspace": "17.2.0-beta.11",
-    "@nrwl/angular": "17.2.0-beta.11"
+    "@nx/devkit": "17.2.0-beta.14",
+    "@nx/cypress": "17.2.0-beta.14",
+    "@nx/jest": "17.2.0-beta.14",
+    "@nx/js": "17.2.0-beta.14",
+    "@nx/eslint": "17.2.0-beta.14",
+    "@nx/webpack": "17.2.0-beta.14",
+    "@nx/web": "17.2.0-beta.14",
+    "@nx/workspace": "17.2.0-beta.14",
+    "@nrwl/angular": "17.2.0-beta.14"
   },
   "peerDependencies": {
     "@angular-devkit/build-angular": ">= 15.0.0 < 18.0.0",

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

@@ -7,9 +7,11 @@ const webpack_nx_build_coordination_plugin_1 = require("@nx/webpack/src/plugins/
 const fs_1 = require("fs");
 const operators_1 = require("nx/src/project-graph/operators");
 const project_graph_1 = require("nx/src/project-graph/project-graph");
+const path_1 = require("path");
 const rxjs_1 = require("rxjs");
 const operators_2 = require("rxjs/operators");
 const angular_version_utils_1 = require("../../executors/utilities/angular-version-utils");
+const esbuild_extensions_1 = require("../../executors/utilities/esbuild-extensions");
 const buildable_libs_1 = require("../utilities/buildable-libs");
 const webpack_1 = require("../utilities/webpack");
 const lib_1 = require("./lib");
@@ -56,6 +58,7 @@ function executeDevServerBuilder(rawOptions, context) {
             target: parsedBuildTarget.target,
         });
         dependencies = foundDependencies;
+        const relativeTsConfigPath = (0, devkit_1.normalizePath)((0, path_1.relative)(context.workspaceRoot, tsConfigPath));
         // We can't just pass the tsconfig path in memory to the angular builder
         // function because we can't pass the build target options to it, the build
         // targets options will be retrieved by the builder from the project
@@ -65,19 +68,20 @@ function executeDevServerBuilder(rawOptions, context) {
         const originalGetTargetOptions = context.getTargetOptions;
         context.getTargetOptions = async (target) => {
             const options = await originalGetTargetOptions(target);
-            options.tsConfig = tsConfigPath;
+            options.tsConfig = relativeTsConfigPath;
             return options;
         };
         // The buildTargetConfiguration also needs to use the generated tsconfig path
         // otherwise the build will fail if customWebpack function/file is referencing
         // local libs. This synchronize the behavior with webpack-browser and
         // webpack-server implementation.
-        buildTargetOptions.tsConfig = tsConfigPath;
+        buildTargetOptions.tsConfig = relativeTsConfigPath;
     }
     const delegateBuilderOptions = getDelegateBuilderOptions(options);
     const isUsingWebpackBuilder = ![
         '@angular-devkit/build-angular:application',
         '@angular-devkit/build-angular:browser-esbuild',
+        '@nx/angular:application',
         '@nx/angular:browser-esbuild',
     ].includes(buildTarget.executor);
     /**
@@ -86,8 +90,11 @@ function executeDevServerBuilder(rawOptions, context) {
      * builders. Since we are using a custom builder, we patch the context to
      * handle `@nx/angular:*` executors.
      */
-    patchBuilderContext(context);
-    return (0, rxjs_1.from)(Promise.resolve().then(() => require('@angular-devkit/build-angular'))).pipe((0, operators_2.switchMap)(({ executeDevServerBuilder }) => executeDevServerBuilder(delegateBuilderOptions, context, {
+    patchBuilderContext(context, !isUsingWebpackBuilder, parsedBuildTarget);
+    return (0, rxjs_1.combineLatest)([
+        (0, rxjs_1.from)(Promise.resolve().then(() => require('@angular-devkit/build-angular'))),
+        (0, rxjs_1.from)((0, esbuild_extensions_1.loadPlugins)(buildTargetOptions.plugins, buildTargetOptions.tsConfig)),
+    ]).pipe((0, operators_2.switchMap)(([{ executeDevServerBuilder }, plugins]) => executeDevServerBuilder(delegateBuilderOptions, context, {
         webpackConfiguration: isUsingWebpackBuilder
             ? async (baseWebpackConfig) => {
                 if (!buildLibsFromSource) {
@@ -115,6 +122,8 @@ function executeDevServerBuilder(rawOptions, context) {
                 indexHtml: (0, webpack_1.resolveIndexHtmlTransformer)(pathToIndexFileTransformer, buildTargetOptions.tsConfig, context.target),
             }
             : {}),
+    }, {
+        buildPlugins: plugins,
     })));
 }
 exports.executeDevServerBuilder = executeDevServerBuilder;
@@ -137,8 +146,9 @@ const executorToBuilderMap = new Map([
         '@nx/angular:browser-esbuild',
         '@angular-devkit/build-angular:browser-esbuild',
     ],
+    ['@nx/angular:application', '@angular-devkit/build-angular:application'],
 ]);
-function patchBuilderContext(context) {
+function patchBuilderContext(context, isUsingEsbuildBuilder, buildTarget) {
     const originalGetBuilderNameForTarget = context.getBuilderNameForTarget;
     context.getBuilderNameForTarget = async (target) => {
         const builderName = await originalGetBuilderNameForTarget(target);
@@ -147,4 +157,23 @@ function patchBuilderContext(context) {
         }
         return builderName;
     };
+    if (isUsingEsbuildBuilder) {
+        const originalGetTargetOptions = context.getTargetOptions;
+        context.getTargetOptions = async (target) => {
+            const options = await originalGetTargetOptions(target);
+            if (target.project === buildTarget.project &&
+                target.target === buildTarget.target &&
+                target.configuration === buildTarget.configuration) {
+                cleanBuildTargetOptions(options);
+            }
+            return options;
+        };
+    }
+}
+function cleanBuildTargetOptions(options) {
+    delete options.buildLibsFromSource;
+    delete options.customWebpackConfig;
+    delete options.indexFileTransformer;
+    delete options.plugins;
+    return options;
 }

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

@@ -7,6 +7,7 @@ const fs_1 = require("fs");
 const configuration_1 = require("nx/src/config/configuration");
 const operators_1 = require("nx/src/project-graph/operators");
 const utils_1 = require("nx/src/tasks-runner/utils");
+const path_1 = require("path");
 const rxjs_1 = require("rxjs");
 const operators_2 = require("rxjs/operators");
 const buildable_libs_1 = require("../utilities/buildable-libs");
@@ -40,7 +41,7 @@ function executeWebpackBrowserBuilder(options, context) {
         projectGraph = (0, devkit_1.readCachedProjectGraph)();
         const { tsConfigPath, dependencies: foundDependencies } = (0, buildable_libs_1.createTmpTsConfigForBuildableLibs)(delegateBuilderOptions.tsConfig, context, { projectGraph });
         dependencies = foundDependencies;
-        delegateBuilderOptions.tsConfig = tsConfigPath;
+        delegateBuilderOptions.tsConfig = (0, devkit_1.normalizePath)((0, path_1.relative)(context.workspaceRoot, tsConfigPath));
     }
     return (0, rxjs_1.from)(Promise.resolve().then(() => require('@angular-devkit/build-angular'))).pipe((0, operators_2.switchMap)(({ executeBrowserBuilder }) => executeBrowserBuilder(delegateBuilderOptions, context, {
         webpackConfiguration: (baseWebpackConfig) => {

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

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.executeWebpackServerBuilder = void 0;
 const devkit_1 = require("@nx/devkit");
 const fs_1 = require("fs");
+const path_1 = require("path");
 const rxjs_1 = require("rxjs");
 const operators_1 = require("rxjs/operators");
 const buildable_libs_1 = require("../utilities/buildable-libs");
@@ -50,7 +51,7 @@ function executeWebpackServerBuilder(options, context) {
     options.buildLibsFromSource ??= true;
     if (!options.buildLibsFromSource) {
         const { tsConfigPath } = (0, buildable_libs_1.createTmpTsConfigForBuildableLibs)(options.tsConfig, context);
-        options.tsConfig = tsConfigPath;
+        options.tsConfig = (0, devkit_1.normalizePath)((0, path_1.relative)(context.workspaceRoot, tsConfigPath));
     }
     return buildServerApp(options, context);
 }

package/src/executors/application/application.impl.d.ts

@@ -0,0 +1,9 @@
+import type { ExecutorContext } from '@nx/devkit';
+import type { ApplicationExecutorOptions } from './schema';
+export default function applicationExecutor(options: ApplicationExecutorOptions, context: ExecutorContext): AsyncGenerator<import("@angular-devkit/core").JsonObject & import("@angular-devkit/architect/src/output-schema").Schema & {
+    outputFiles?: import("@angular-devkit/build-angular/src/tools/esbuild/bundler-context").BuildOutputFile[];
+    assetFiles?: {
+        source: string;
+        destination: string;
+    }[];
+}, any, undefined>;

package/src/executors/application/application.impl.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ngcli_adapter_1 = require("nx/src/adapter/ngcli-adapter");
+const angular_version_utils_1 = require("../utilities/angular-version-utils");
+const buildable_libs_1 = require("../utilities/buildable-libs");
+const esbuild_extensions_1 = require("../utilities/esbuild-extensions");
+async function* applicationExecutor(options, context) {
+    const { major: angularMajorVersion, version: angularVersion } = (0, angular_version_utils_1.getInstalledAngularVersionInfo)();
+    if (angularMajorVersion < 17) {
+        throw new Error(`The "application" executor requires Angular version 17 or greater. You are currently using version ${angularVersion}.`);
+    }
+    const { buildLibsFromSource = true, plugins: pluginPaths, ...delegateExecutorOptions } = options;
+    let dependencies;
+    if (!buildLibsFromSource) {
+        const { tsConfigPath, dependencies: foundDependencies } = (0, buildable_libs_1.createTmpTsConfigForBuildableLibs)(delegateExecutorOptions.tsConfig, context);
+        dependencies = foundDependencies;
+        delegateExecutorOptions.tsConfig = tsConfigPath;
+    }
+    const plugins = await (0, esbuild_extensions_1.loadPlugins)(pluginPaths, options.tsConfig);
+    const { buildApplication } = await Promise.resolve().then(() => require('@angular-devkit/build-angular'));
+    const builderContext = await (0, ngcli_adapter_1.createBuilderContext)({
+        builderName: 'application',
+        description: 'Build an application.',
+        optionSchema: await Promise.resolve().then(() => require('./schema.json')),
+    }, context);
+    return yield* buildApplication(delegateExecutorOptions, builderContext, plugins);
+}
+exports.default = applicationExecutor;

package/src/executors/application/schema.d.ts

@@ -0,0 +1,7 @@
+import type { ApplicationBuilderOptions } from '@angular-devkit/build-angular';
+import type { PluginSpec } from '../utilities/esbuild-extensions';
+
+export interface ApplicationExecutorOptions extends ApplicationBuilderOptions {
+  buildLibsFromSource?: boolean;
+  plugins?: string[] | PluginSpec[];
+}

package/src/executors/application/schema.json

@@ -0,0 +1,612 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "title": "Schema for Nx Application Executor",
+  "description": "Builds an application with esbuild with support for incremental builds. _Note: this is only supported in Angular versions >= 17.0.0_.",
+  "examplesFile": "../../../docs/application-executor-examples.md",
+  "outputCapture": "direct-nodejs",
+  "type": "object",
+  "properties": {
+    "assets": {
+      "type": "array",
+      "description": "List of static application assets.",
+      "default": [],
+      "items": {
+        "$ref": "#/definitions/assetPattern"
+      }
+    },
+    "browser": {
+      "type": "string",
+      "description": "The full path for the browser entry point to the application, relative to the current workspace."
+    },
+    "server": {
+      "type": "string",
+      "description": "The full path for the server entry point to the application, relative to the current workspace."
+    },
+    "polyfills": {
+      "description": "A list of polyfills to include in the build. Can be a full path for a file, relative to the current workspace or module specifier. Example: 'zone.js'.",
+      "type": "array",
+      "items": {
+        "type": "string",
+        "uniqueItems": true
+      },
+      "default": []
+    },
+    "tsConfig": {
+      "type": "string",
+      "description": "The full path for the TypeScript configuration file, relative to the current workspace."
+    },
+    "scripts": {
+      "description": "Global scripts to be included in the build.",
+      "type": "array",
+      "default": [],
+      "items": {
+        "oneOf": [
+          {
+            "type": "object",
+            "properties": {
+              "input": {
+                "type": "string",
+                "description": "The file to include.",
+                "pattern": "\\.[cm]?jsx?$"
+              },
+              "bundleName": {
+                "type": "string",
+                "pattern": "^[\\w\\-.]*$",
+                "description": "The bundle name for this extra entry point."
+              },
+              "inject": {
+                "type": "boolean",
+                "description": "If the bundle will be referenced in the HTML file.",
+                "default": true
+              }
+            },
+            "additionalProperties": false,
+            "required": ["input"]
+          },
+          {
+            "type": "string",
+            "description": "The JavaScript/TypeScript file or package containing the file to include."
+          }
+        ]
+      }
+    },
+    "styles": {
+      "description": "Global styles to be included in the build.",
+      "type": "array",
+      "default": [],
+      "items": {
+        "oneOf": [
+          {
+            "type": "object",
+            "properties": {
+              "input": {
+                "type": "string",
+                "description": "The file to include.",
+                "pattern": "\\.(?:css|scss|sass|less)$"
+              },
+              "bundleName": {
+                "type": "string",
+                "pattern": "^[\\w\\-.]*$",
+                "description": "The bundle name for this extra entry point."
+              },
+              "inject": {
+                "type": "boolean",
+                "description": "If the bundle will be referenced in the HTML file.",
+                "default": true
+              }
+            },
+            "additionalProperties": false,
+            "required": ["input"]
+          },
+          {
+            "type": "string",
+            "description": "The file to include.",
+            "pattern": "\\.(?:css|scss|sass|less)$"
+          }
+        ]
+      }
+    },
+    "inlineStyleLanguage": {
+      "description": "The stylesheet language to use for the application's inline component styles.",
+      "type": "string",
+      "default": "css",
+      "enum": ["css", "less", "sass", "scss"]
+    },
+    "stylePreprocessorOptions": {
+      "description": "Options to pass to style preprocessors.",
+      "type": "object",
+      "properties": {
+        "includePaths": {
+          "description": "Paths to include. Paths will be resolved to workspace root.",
+          "type": "array",
+          "items": {
+            "type": "string"
+          },
+          "default": []
+        }
+      },
+      "additionalProperties": false
+    },
+    "externalDependencies": {
+      "description": "Exclude the listed external dependencies from being bundled into the bundle. Instead, the created bundle relies on these dependencies to be available during runtime.",
+      "type": "array",
+      "items": {
+        "type": "string"
+      },
+      "default": []
+    },
+    "optimization": {
+      "description": "Enables optimization of the build output. Including minification of scripts and styles, tree-shaking, dead-code elimination, inlining of critical CSS and fonts inlining. For more information, see https://angular.io/guide/workspace-config#optimization-configuration.",
+      "default": true,
+      "x-user-analytics": "ep.ng_optimization",
+      "oneOf": [
+        {
+          "type": "object",
+          "properties": {
+            "scripts": {
+              "type": "boolean",
+              "description": "Enables optimization of the scripts output.",
+              "default": true
+            },
+            "styles": {
+              "description": "Enables optimization of the styles output.",
+              "default": true,
+              "oneOf": [
+                {
+                  "type": "object",
+                  "properties": {
+                    "minify": {
+                      "type": "boolean",
+                      "description": "Minify CSS definitions by removing extraneous whitespace and comments, merging identifiers and minimizing values.",
+                      "default": true
+                    },
+                    "inlineCritical": {
+                      "type": "boolean",
+                      "description": "Extract and inline critical CSS definitions to improve first paint time.",
+                      "default": true
+                    }
+                  },
+                  "additionalProperties": false
+                },
+                {
+                  "type": "boolean"
+                }
+              ]
+            },
+            "fonts": {
+              "description": "Enables optimization for fonts. This option requires internet access. `HTTPS_PROXY` environment variable can be used to specify a proxy server.",
+              "default": true,
+              "oneOf": [
+                {
+                  "type": "object",
+                  "properties": {
+                    "inline": {
+                      "type": "boolean",
+                      "description": "Reduce render blocking requests by inlining external Google Fonts and Adobe Fonts CSS definitions in the application's HTML index file. This option requires internet access. `HTTPS_PROXY` environment variable can be used to specify a proxy server.",
+                      "default": true
+                    }
+                  },
+                  "additionalProperties": false
+                },
+                {
+                  "type": "boolean"
+                }
+              ]
+            }
+          },
+          "additionalProperties": false
+        },
+        {
+          "type": "boolean"
+        }
+      ]
+    },
+    "fileReplacements": {
+      "description": "Replace compilation source files with other compilation source files in the build.",
+      "type": "array",
+      "items": {
+        "$ref": "#/definitions/fileReplacement"
+      },
+      "default": []
+    },
+    "outputPath": {
+      "type": "string",
+      "description": "The full path for the new output directory, relative to the current workspace."
+    },
+    "aot": {
+      "type": "boolean",
+      "description": "Build using Ahead of Time compilation.",
+      "x-user-analytics": "ep.ng_aot",
+      "default": true
+    },
+    "sourceMap": {
+      "description": "Output source maps for scripts and styles. For more information, see https://angular.io/guide/workspace-config#source-map-configuration.",
+      "default": false,
+      "oneOf": [
+        {
+          "type": "object",
+          "properties": {
+            "scripts": {
+              "type": "boolean",
+              "description": "Output source maps for all scripts.",
+              "default": true
+            },
+            "styles": {
+              "type": "boolean",
+              "description": "Output source maps for all styles.",
+              "default": true
+            },
+            "hidden": {
+              "type": "boolean",
+              "description": "Output source maps used for error reporting tools.",
+              "default": false
+            },
+            "vendor": {
+              "type": "boolean",
+              "description": "Resolve vendor packages source maps.",
+              "default": false
+            }
+          },
+          "additionalProperties": false
+        },
+        {
+          "type": "boolean"
+        }
+      ]
+    },
+    "baseHref": {
+      "type": "string",
+      "description": "Base url for the application being built."
+    },
+    "verbose": {
+      "type": "boolean",
+      "description": "Adds more details to output logging.",
+      "default": false
+    },
+    "progress": {
+      "type": "boolean",
+      "description": "Log progress to the console while building.",
+      "default": true
+    },
+    "i18nMissingTranslation": {
+      "type": "string",
+      "description": "How to handle missing translations for i18n.",
+      "enum": ["warning", "error", "ignore"],
+      "default": "warning"
+    },
+    "i18nDuplicateTranslation": {
+      "type": "string",
+      "description": "How to handle duplicate translations for i18n.",
+      "enum": ["warning", "error", "ignore"],
+      "default": "warning"
+    },
+    "localize": {
+      "description": "Translate the bundles in one or more locales.",
+      "oneOf": [
+        {
+          "type": "boolean",
+          "description": "Translate all locales."
+        },
+        {
+          "type": "array",
+          "description": "List of locales ID's to translate.",
+          "minItems": 1,
+          "items": {
+            "type": "string",
+            "pattern": "^[a-zA-Z]{2,3}(-[a-zA-Z]{4})?(-([a-zA-Z]{2}|[0-9]{3}))?(-[a-zA-Z]{5,8})?(-x(-[a-zA-Z0-9]{1,8})+)?$"
+          }
+        }
+      ]
+    },
+    "watch": {
+      "type": "boolean",
+      "description": "Run build when files change.",
+      "default": false
+    },
+    "outputHashing": {
+      "type": "string",
+      "description": "Define the output filename cache-busting hashing mode.",
+      "default": "none",
+      "enum": ["none", "all", "media", "bundles"]
+    },
+    "poll": {
+      "type": "number",
+      "description": "Enable and define the file watching poll time period in milliseconds."
+    },
+    "deleteOutputPath": {
+      "type": "boolean",
+      "description": "Delete the output path before building.",
+      "default": true
+    },
+    "preserveSymlinks": {
+      "type": "boolean",
+      "description": "Do not use the real path when resolving modules. If unset then will default to `true` if NodeJS option --preserve-symlinks is set."
+    },
+    "extractLicenses": {
+      "type": "boolean",
+      "description": "Extract all licenses in a separate file.",
+      "default": true
+    },
+    "namedChunks": {
+      "type": "boolean",
+      "description": "Use file name for lazy loaded chunks.",
+      "default": false
+    },
+    "subresourceIntegrity": {
+      "type": "boolean",
+      "description": "Enables the use of subresource integrity validation.",
+      "default": false
+    },
+    "serviceWorker": {
+      "description": "Generates a service worker configuration.",
+      "default": false,
+      "oneOf": [
+        {
+          "type": "string",
+          "description": "Path to ngsw-config.json."
+        },
+        {
+          "const": false,
+          "type": "boolean",
+          "description": "Does not generate a service worker configuration."
+        }
+      ]
+    },
+    "index": {
+      "description": "Configures the generation of the application's HTML index.",
+      "oneOf": [
+        {
+          "type": "string",
+          "description": "The path of a file to use for the application's HTML index. The filename of the specified path will be used for the generated file and will be created in the root of the application's configured output path."
+        },
+        {
+          "type": "object",
+          "description": "",
+          "properties": {
+            "input": {
+              "type": "string",
+              "minLength": 1,
+              "description": "The path of a file to use for the application's generated HTML index."
+            },
+            "output": {
+              "type": "string",
+              "minLength": 1,
+              "default": "index.html",
+              "description": "The output path of the application's generated HTML index file. The full provided path will be used and will be considered relative to the application's configured output path."
+            }
+          },
+          "required": ["input"]
+        },
+        {
+          "const": false,
+          "type": "boolean",
+          "description": "Does not generate an `index.html` file."
+        }
+      ]
+    },
+    "statsJson": {
+      "type": "boolean",
+      "description": "Generates a 'stats.json' file which can be analyzed with https://esbuild.github.io/analyze/.",
+      "default": false
+    },
+    "budgets": {
+      "description": "Budget thresholds to ensure parts of your application stay within boundaries which you set.",
+      "type": "array",
+      "items": {
+        "$ref": "#/definitions/budget"
+      },
+      "default": []
+    },
+    "webWorkerTsConfig": {
+      "type": "string",
+      "description": "TypeScript configuration for Web Worker modules."
+    },
+    "crossOrigin": {
+      "type": "string",
+      "description": "Define the crossorigin attribute setting of elements that provide CORS support.",
+      "default": "none",
+      "enum": ["none", "anonymous", "use-credentials"]
+    },
+    "allowedCommonJsDependencies": {
+      "description": "A list of CommonJS or AMD packages that are allowed to be used without a build time warning. Use `'*'` to allow all.",
+      "type": "array",
+      "items": {
+        "type": "string"
+      },
+      "default": []
+    },
+    "prerender": {
+      "description": "Prerender (SSG) pages of your application during build time.",
+      "default": false,
+      "oneOf": [
+        {
+          "type": "boolean",
+          "description": "Enable prerending of pages of your application during build time."
+        },
+        {
+          "type": "object",
+          "properties": {
+            "routesFile": {
+              "type": "string",
+              "description": "The path to a file that contains a list of all routes to prerender, separated by newlines. This option is useful if you want to prerender routes with parameterized URLs."
+            },
+            "discoverRoutes": {
+              "type": "boolean",
+              "description": "Whether the builder should process the Angular Router configuration to find all unparameterized routes and prerender them.",
+              "default": true
+            }
+          },
+          "additionalProperties": false
+        }
+      ]
+    },
+    "ssr": {
+      "description": "Server side render (SSR) pages of your application during runtime.",
+      "default": false,
+      "oneOf": [
+        {
+          "type": "boolean",
+          "description": "Enable the server bundles to be written to disk."
+        },
+        {
+          "type": "object",
+          "properties": {
+            "entry": {
+              "type": "string",
+              "description": "The server entry-point that when executed will spawn the web server."
+            }
+          },
+          "additionalProperties": false
+        }
+      ]
+    },
+    "appShell": {
+      "type": "boolean",
+      "description": "Generates an application shell during build time.",
+      "default": false
+    },
+    "buildLibsFromSource": {
+      "type": "boolean",
+      "description": "Read buildable libraries from source instead of building them separately.",
+      "default": true
+    },
+    "plugins": {
+      "description": "A list of ESBuild plugins.",
+      "type": "array",
+      "items": {
+        "oneOf": [
+          {
+            "type": "object",
+            "properties": {
+              "path": {
+                "type": "string",
+                "description": "The path to the plugin. Relative to the workspace root."
+              },
+              "options": {
+                "type": "object",
+                "description": "The options to provide to the plugin.",
+                "properties": {},
+                "additionalProperties": true
+              }
+            },
+            "additionalProperties": false,
+            "required": ["path"]
+          },
+          {
+            "type": "string",
+            "description": "The path to the plugin. Relative to the workspace root."
+          }
+        ]
+      }
+    }
+  },
+  "additionalProperties": false,
+  "required": ["outputPath", "index", "browser", "tsConfig"],
+  "definitions": {
+    "assetPattern": {
+      "oneOf": [
+        {
+          "type": "object",
+          "properties": {
+            "followSymlinks": {
+              "type": "boolean",
+              "default": false,
+              "description": "Allow glob patterns to follow symlink directories. This allows subdirectories of the symlink to be searched."
+            },
+            "glob": {
+              "type": "string",
+              "description": "The pattern to match."
+            },
+            "input": {
+              "type": "string",
+              "description": "The input directory path in which to apply 'glob'. Defaults to the project root."
+            },
+            "ignore": {
+              "description": "An array of globs to ignore.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            },
+            "output": {
+              "type": "string",
+              "description": "Absolute path within the output."
+            }
+          },
+          "additionalProperties": false,
+          "required": ["glob", "input", "output"]
+        },
+        {
+          "type": "string"
+        }
+      ]
+    },
+    "fileReplacement": {
+      "type": "object",
+      "properties": {
+        "replace": {
+          "type": "string",
+          "pattern": "\\.(([cm]?j|t)sx?|json)$"
+        },
+        "with": {
+          "type": "string",
+          "pattern": "\\.(([cm]?j|t)sx?|json)$"
+        }
+      },
+      "additionalProperties": false,
+      "required": ["replace", "with"]
+    },
+    "budget": {
+      "type": "object",
+      "properties": {
+        "type": {
+          "type": "string",
+          "description": "The type of budget.",
+          "enum": [
+            "all",
+            "allScript",
+            "any",
+            "anyScript",
+            "anyComponentStyle",
+            "bundle",
+            "initial"
+          ]
+        },
+        "name": {
+          "type": "string",
+          "description": "The name of the bundle."
+        },
+        "baseline": {
+          "type": "string",
+          "description": "The baseline size for comparison."
+        },
+        "maximumWarning": {
+          "type": "string",
+          "description": "The maximum threshold for warning relative to the baseline."
+        },
+        "maximumError": {
+          "type": "string",
+          "description": "The maximum threshold for error relative to the baseline."
+        },
+        "minimumWarning": {
+          "type": "string",
+          "description": "The minimum threshold for warning relative to the baseline."
+        },
+        "minimumError": {
+          "type": "string",
+          "description": "The minimum threshold for error relative to the baseline."
+        },
+        "warning": {
+          "type": "string",
+          "description": "The threshold for warning relative to the baseline (min & max)."
+        },
+        "error": {
+          "type": "string",
+          "description": "The threshold for error relative to the baseline (min & max)."
+        }
+      },
+      "additionalProperties": false,
+      "required": ["type"]
+    }
+  }
+}

package/src/executors/browser-esbuild/browser-esbuild.impl.d.ts

@@ -1,8 +1,7 @@
-import { type EsBuildSchema } from './schema';
 import { type ExecutorContext } from '@nx/devkit';
-import { type OutputFile } from 'esbuild';
+import type { EsBuildSchema } from './schema';
 export default function esbuildExecutor(options: EsBuildSchema, context: ExecutorContext): AsyncGenerator<import("@angular-devkit/core").JsonObject & import("@angular-devkit/architect/src/output-schema").Schema & {
-    outputFiles?: OutputFile[];
+    outputFiles?: import("@angular-devkit/build-angular/src/tools/esbuild/bundler-context").BuildOutputFile[];
     assetFiles?: {
         source: string;
         destination: string;

package/src/executors/browser-esbuild/browser-esbuild.impl.js

@@ -1,25 +1,34 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const devkit_1 = require("@nx/devkit");
-const buildable_libs_1 = require("./lib/buildable-libs");
 const ngcli_adapter_1 = require("nx/src/adapter/ngcli-adapter");
+const angular_version_utils_1 = require("../utilities/angular-version-utils");
+const buildable_libs_1 = require("../utilities/buildable-libs");
+const esbuild_extensions_1 = require("../utilities/esbuild-extensions");
 async function* esbuildExecutor(options, context) {
+    if (options.plugins) {
+        const { major: angularMajorVersion, version: angularVersion } = (0, angular_version_utils_1.getInstalledAngularVersionInfo)();
+        if (angularMajorVersion < 17) {
+            throw new Error((0, devkit_1.stripIndents) `The "plugins" option is only supported in Angular >= 17.0.0. You are currently using "${angularVersion}".
+        You can resolve this error by removing the "plugins" option or by migrating to Angular 17.0.0.`);
+        }
+    }
     options.buildLibsFromSource ??= true;
-    const { buildLibsFromSource, ...delegateExecutorOptions } = options;
+    const { buildLibsFromSource, plugins: pluginPaths, ...delegateExecutorOptions } = options;
     let dependencies;
-    let projectGraph = context.projectGraph;
     if (!buildLibsFromSource) {
-        projectGraph = projectGraph ?? (0, devkit_1.readCachedProjectGraph)();
-        const { tsConfigPath, dependencies: foundDependencies } = (0, buildable_libs_1.createTmpTsConfigForBuildableLibs)(delegateExecutorOptions.tsConfig, context, { projectGraph });
+        const { tsConfigPath, dependencies: foundDependencies } = (0, buildable_libs_1.createTmpTsConfigForBuildableLibs)(delegateExecutorOptions.tsConfig, context);
         dependencies = foundDependencies;
         delegateExecutorOptions.tsConfig = tsConfigPath;
     }
+    const plugins = await (0, esbuild_extensions_1.loadPlugins)(pluginPaths, options.tsConfig);
     const { buildEsbuildBrowser } = await Promise.resolve().then(() => require('@angular-devkit/build-angular/src/builders/browser-esbuild/index'));
     const builderContext = await (0, ngcli_adapter_1.createBuilderContext)({
         builderName: 'browser-esbuild',
         description: 'Build a browser application',
         optionSchema: await Promise.resolve().then(() => require('@angular-devkit/build-angular/src/builders/browser-esbuild/schema.json')),
     }, context);
-    return yield* buildEsbuildBrowser(delegateExecutorOptions, builderContext);
+    return yield* buildEsbuildBrowser(delegateExecutorOptions, builderContext, 
+    /* infrastructureSettings */ undefined, plugins);
 }
 exports.default = esbuildExecutor;

package/src/executors/browser-esbuild/schema.d.ts

@@ -1,5 +1,7 @@
-import { Schema } from '@angular-devkit/build-angular/src/builders/browser-esbuild/schema';
+import type { Schema } from '@angular-devkit/build-angular/src/builders/browser-esbuild/schema';
+import type { PluginSpec } from '../utilities/esbuild-extensions';
 
 export interface EsBuildSchema extends Schema {
   buildLibsFromSource?: boolean;
+  plugins?: string[] | PluginSpec[];
 }

package/src/executors/browser-esbuild/schema.json

@@ -2,6 +2,7 @@
   "$schema": "http://json-schema.org/draft-07/schema",
   "title": "Schema for Nx ESBuild Executor",
   "description": "Nx ESBuild Executor supporting Incremental Builds.",
+  "examplesFile": "../../../docs/browser-esbuild-examples.md",
   "outputCapture": "direct-nodejs",
   "type": "object",
   "properties": {
@@ -441,6 +442,35 @@
       "type": "boolean",
       "description": "Read buildable libraries from source instead of building them separately.",
       "default": true
+    },
+    "plugins": {
+      "description": "A list of ESBuild plugins. _Note: this is only supported in Angular versions >= 17.0.0_.",
+      "type": "array",
+      "items": {
+        "oneOf": [
+          {
+            "type": "object",
+            "properties": {
+              "path": {
+                "type": "string",
+                "description": "The path to the plugin. Relative to the workspace root."
+              },
+              "options": {
+                "type": "object",
+                "description": "The options to provide to the plugin.",
+                "properties": {},
+                "additionalProperties": true
+              }
+            },
+            "additionalProperties": false,
+            "required": ["path"]
+          },
+          {
+            "type": "string",
+            "description": "The path to the plugin. Relative to the workspace root."
+          }
+        ]
+      }
     }
   },
   "additionalProperties": false,

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

@@ -62,6 +62,9 @@ async function* moduleFederationDevServerExecutor(schema, context) {
             if (remotePort >= portToUse) {
                 return remotePort + 1;
             }
+            else {
+                return portToUse;
+            }
         }, options.staticRemotesPort);
     }
     await (0, lib_1.buildStaticRemotes)(remotes, nxBin, context, options);

package/src/executors/utilities/buildable-libs.d.ts

@@ -0,0 +1,6 @@
+import { type ExecutorContext } from '@nx/devkit';
+import { type DependentBuildableProjectNode } from '@nx/js/src/utils/buildable-libs-utils';
+export declare function createTmpTsConfigForBuildableLibs(tsConfigPath: string, context: ExecutorContext): {
+    tsConfigPath: string;
+    dependencies: DependentBuildableProjectNode[];
+};

package/src/executors/{browser-esbuild/lib → utilities}/buildable-libs.js

@@ -1,16 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createTmpTsConfigForBuildableLibs = void 0;
+const devkit_1 = require("@nx/devkit");
 const buildable_libs_utils_1 = require("@nx/js/src/utils/buildable-libs-utils");
 const path_1 = require("path");
-const devkit_1 = require("@nx/devkit");
-function createTmpTsConfigForBuildableLibs(tsConfigPath, context, options) {
+function createTmpTsConfigForBuildableLibs(tsConfigPath, context) {
     let dependencies;
-    const result = (0, buildable_libs_utils_1.calculateProjectDependencies)(options?.projectGraph ?? (0, devkit_1.readCachedProjectGraph)(), context.root, context.projectName, options?.target ?? context.targetName, context.configurationName);
+    const result = (0, buildable_libs_utils_1.calculateProjectDependencies)(context.projectGraph ?? (0, devkit_1.readCachedProjectGraph)(), context.root, context.projectName, context.targetName, context.configurationName);
     dependencies = result.dependencies;
     const tmpTsConfigPath = (0, buildable_libs_utils_1.createTmpTsConfig)((0, path_1.join)(context.root, tsConfigPath), context.root, result.target.data.root, dependencies);
     process.env.NX_TSCONFIG_PATH = tmpTsConfigPath;
-    // Angular EsBuild Builder appends the workspaceRoot to the config path, so remove it.
     const tmpTsConfigPathWithoutWorkspaceRoot = tmpTsConfigPath.replace(context.root, '');
     return { tsConfigPath: tmpTsConfigPathWithoutWorkspaceRoot, dependencies };
 }

package/src/executors/utilities/esbuild-extensions.d.ts

@@ -0,0 +1,6 @@
+import type { Plugin } from 'esbuild';
+export type PluginSpec = {
+    path: string;
+    options: any;
+};
+export declare function loadPlugins(plugins: string[] | PluginSpec[] | undefined, tsConfig: string): Promise<Plugin[]>;

package/src/executors/utilities/esbuild-extensions.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.loadPlugins = void 0;
+const internal_1 = require("@nx/js/src/internal");
+const module_loader_1 = require("./module-loader");
+async function loadPlugins(plugins, tsConfig) {
+    if (!plugins?.length) {
+        return [];
+    }
+    const cleanupTranspiler = (0, internal_1.registerTsProject)(tsConfig);
+    try {
+        return await Promise.all(plugins.map((plugin) => loadPlugin(plugin)));
+    }
+    finally {
+        cleanupTranspiler();
+    }
+}
+exports.loadPlugins = loadPlugins;
+async function loadPlugin(pluginSpec) {
+    const pluginPath = typeof pluginSpec === 'string' ? pluginSpec : pluginSpec.path;
+    let plugin = await (0, module_loader_1.loadModule)(pluginPath);
+    if (typeof plugin === 'function') {
+        plugin =
+            typeof pluginSpec === 'object' ? plugin(pluginSpec.options) : plugin();
+    }
+    return plugin;
+}

package/src/executors/utilities/module-loader.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="node" />
+export declare function loadModule<T = any>(path: string): Promise<T>;
+/**
+ * This uses a dynamic import to load a module which may be ESM.
+ * CommonJS code can load ESM code via a dynamic import. Unfortunately, TypeScript
+ * will currently, unconditionally downlevel dynamic import into a require call.
+ * require calls cannot load ESM code and will result in a runtime error. To workaround
+ * this, a Function constructor is used to prevent TypeScript from changing the dynamic import.
+ * Once TypeScript provides support for keeping the dynamic import this workaround can
+ * be dropped.
+ *
+ * @param modulePath The path of the module to load.
+ * @returns A Promise that resolves to the dynamically imported module.
+ */
+export declare function loadEsmModule<T>(modulePath: string | URL): Promise<T>;

package/src/executors/utilities/module-loader.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.loadEsmModule = exports.loadModule = void 0;
+const path_1 = require("path");
+const node_url_1 = require("node:url");
+async function loadModule(path) {
+    switch ((0, path_1.extname)(path)) {
+        case '.mjs': {
+            const result = await loadEsmModule((0, node_url_1.pathToFileURL)(path));
+            return result.default ?? result;
+        }
+        case '.cjs': {
+            const result = require(path);
+            return result.default ?? result;
+        }
+        default:
+            // it can be CommonJS or ESM, try both
+            try {
+                const result = require(path);
+                return result.default ?? result;
+            }
+            catch (e) {
+                if (e.code === 'ERR_REQUIRE_ESM') {
+                    const result = await loadEsmModule((0, node_url_1.pathToFileURL)(path));
+                    return result.default ?? result;
+                }
+                throw e;
+            }
+    }
+}
+exports.loadModule = loadModule;
+/**
+ * Lazily compiled dynamic import loader function.
+ */
+let load;
+/**
+ * This uses a dynamic import to load a module which may be ESM.
+ * CommonJS code can load ESM code via a dynamic import. Unfortunately, TypeScript
+ * will currently, unconditionally downlevel dynamic import into a require call.
+ * require calls cannot load ESM code and will result in a runtime error. To workaround
+ * this, a Function constructor is used to prevent TypeScript from changing the dynamic import.
+ * Once TypeScript provides support for keeping the dynamic import this workaround can
+ * be dropped.
+ *
+ * @param modulePath The path of the module to load.
+ * @returns A Promise that resolves to the dynamically imported module.
+ */
+function loadEsmModule(modulePath) {
+    load ??= new Function('modulePath', `return import(modulePath);`);
+    return load(modulePath);
+}
+exports.loadEsmModule = loadEsmModule;

package/src/executors/utilities/ng-compiler-cli.d.ts

@@ -1,15 +1 @@
-/// <reference types="node" />
 export declare function ngCompilerCli(): Promise<typeof import('@angular/compiler-cli')>;
-/**
- * This uses a dynamic import to load a module which may be ESM.
- * CommonJS code can load ESM code via a dynamic import. Unfortunately, TypeScript
- * will currently, unconditionally downlevel dynamic import into a require call.
- * require calls cannot load ESM code and will result in a runtime error. To workaround
- * this, a Function constructor is used to prevent TypeScript from changing the dynamic import.
- * Once TypeScript provides support for keeping the dynamic import this workaround can
- * be dropped.
- *
- * @param modulePath The path of the module to load.
- * @returns A Promise that resolves to the dynamically imported module.
- */
-export declare function loadEsmModule<T>(modulePath: string | URL): Promise<T>;

package/src/executors/utilities/ng-compiler-cli.js

@@ -1,28 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.loadEsmModule = exports.ngCompilerCli = void 0;
+exports.ngCompilerCli = void 0;
+const module_loader_1 = require("./module-loader");
 function ngCompilerCli() {
-    return loadEsmModule('@angular/compiler-cli');
+    return (0, module_loader_1.loadEsmModule)('@angular/compiler-cli');
 }
 exports.ngCompilerCli = ngCompilerCli;
-/**
- * Lazily compiled dynamic import loader function.
- */
-let load;
-/**
- * This uses a dynamic import to load a module which may be ESM.
- * CommonJS code can load ESM code via a dynamic import. Unfortunately, TypeScript
- * will currently, unconditionally downlevel dynamic import into a require call.
- * require calls cannot load ESM code and will result in a runtime error. To workaround
- * this, a Function constructor is used to prevent TypeScript from changing the dynamic import.
- * Once TypeScript provides support for keeping the dynamic import this workaround can
- * be dropped.
- *
- * @param modulePath The path of the module to load.
- * @returns A Promise that resolves to the dynamically imported module.
- */
-function loadEsmModule(modulePath) {
-    load ??= new Function('modulePath', `return import(modulePath);`);
-    return load(modulePath);
-}
-exports.loadEsmModule = loadEsmModule;

package/src/executors/browser-esbuild/lib/buildable-libs.d.ts

@@ -1,9 +0,0 @@
-import { DependentBuildableProjectNode } from '@nx/js/src/utils/buildable-libs-utils';
-import { type ExecutorContext, type ProjectGraph } from '@nx/devkit';
-export declare function createTmpTsConfigForBuildableLibs(tsConfigPath: string, context: ExecutorContext, options?: {
-    projectGraph?: ProjectGraph;
-    target?: string;
-}): {
-    tsConfigPath: string;
-    dependencies: DependentBuildableProjectNode[];
-};