@angular-devkit/build-angular 17.1.0-next.2 → 17.1.0-next.3

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "17.1.0-next.2",
+  "version": "17.1.0-next.3",
   "description": "Angular Webpack Build Facade",
   "main": "src/index.js",
   "typings": "src/index.d.ts",
   "builders": "builders.json",
   "dependencies": {
     "@ampproject/remapping": "2.2.1",
-    "@angular-devkit/architect": "0.1701.0-next.2",
-    "@angular-devkit/build-webpack": "0.1701.0-next.2",
-    "@angular-devkit/core": "17.1.0-next.2",
+    "@angular-devkit/architect": "0.1701.0-next.3",
+    "@angular-devkit/build-webpack": "0.1701.0-next.3",
+    "@angular-devkit/core": "17.1.0-next.3",
     "@babel/core": "7.23.6",
     "@babel/generator": "7.23.6",
     "@babel/helper-annotate-as-pure": "7.22.5",
@@ -20,7 +20,7 @@
     "@babel/preset-env": "7.23.6",
     "@babel/runtime": "7.23.6",
     "@discoveryjs/json-ext": "0.5.7",
-    "@ngtools/webpack": "17.1.0-next.2",
+    "@ngtools/webpack": "17.1.0-next.3",
     "@vitejs/plugin-basic-ssl": "1.0.2",
     "ansi-colors": "4.1.3",
     "autoprefixer": "10.4.16",
@@ -30,7 +30,7 @@
     "copy-webpack-plugin": "11.0.0",
     "critters": "0.0.20",
     "css-loader": "6.8.1",
-    "esbuild-wasm": "0.19.9",
+    "esbuild-wasm": "0.19.10",
     "fast-glob": "3.3.2",
     "https-proxy-agent": "7.0.2",
     "http-proxy-middleware": "2.0.6",
@@ -43,7 +43,7 @@
     "loader-utils": "3.2.1",
     "magic-string": "0.30.5",
     "mini-css-extract-plugin": "2.7.6",
-    "mrmime": "1.0.1",
+    "mrmime": "2.0.0",
     "open": "8.4.2",
     "ora": "5.4.1",
     "parse5-html-rewriting-stream": "7.0.0",
@@ -62,8 +62,8 @@
     "text-table": "0.2.0",
     "tree-kill": "1.2.2",
     "tslib": "2.6.2",
-    "undici": "6.0.1",
-    "vite": "5.0.7",
+    "undici": "6.2.0",
+    "vite": "5.0.10",
     "watchpack": "2.4.0",
     "webpack": "5.89.0",
     "webpack-dev-middleware": "6.1.1",
@@ -72,7 +72,7 @@
     "webpack-subresource-integrity": "5.1.0"
   },
   "optionalDependencies": {
-    "esbuild": "0.19.9"
+    "esbuild": "0.19.10"
   },
   "peerDependencies": {
     "@angular/compiler-cli": "^17.0.0 || ^17.1.0-next.0",

package/src/builders/application/build-action.d.ts

@@ -10,14 +10,15 @@ import type { logging } from '@angular-devkit/core';
 import { BuildOutputFile } from '../../tools/esbuild/bundler-context';
 import { ExecutionResult, RebuildState } from '../../tools/esbuild/bundler-execution-result';
 import { NormalizedCachedOptions } from '../../utils/normalize-cache';
+import { NormalizedOutputOptions } from './options';
 export declare function runEsBuildBuildAction(action: (rebuildState?: RebuildState) => ExecutionResult | Promise<ExecutionResult>, options: {
     workspaceRoot: string;
     projectRoot: string;
-    outputPath: string;
+    outputOptions: NormalizedOutputOptions;
     logger: logging.LoggerApi;
     cacheOptions: NormalizedCachedOptions;
-    writeToFileSystem?: boolean;
-    writeToFileSystemFilter?: (file: BuildOutputFile) => boolean;
+    writeToFileSystem: boolean;
+    writeToFileSystemFilter: ((file: BuildOutputFile) => boolean) | undefined;
     watch?: boolean;
     verbose?: boolean;
     progress?: boolean;

package/src/builders/application/build-action.js

@@ -41,9 +41,12 @@ const utils_1 = require("../../tools/esbuild/utils");
 const delete_output_dir_1 = require("../../utils/delete-output-dir");
 const environment_options_1 = require("../../utils/environment-options");
 async function* runEsBuildBuildAction(action, options) {
-    const { writeToFileSystemFilter, writeToFileSystem = true, watch, poll, logger, deleteOutputPath, cacheOptions, outputPath, verbose, projectRoot, workspaceRoot, progress, preserveSymlinks, } = options;
+    const { writeToFileSystemFilter, writeToFileSystem, watch, poll, logger, deleteOutputPath, cacheOptions, outputOptions, verbose, projectRoot, workspaceRoot, progress, preserveSymlinks, } = options;
     if (deleteOutputPath && writeToFileSystem) {
-        await (0, delete_output_dir_1.deleteOutputDir)(workspaceRoot, outputPath, ['browser', 'server']);
+        await (0, delete_output_dir_1.deleteOutputDir)(workspaceRoot, outputOptions.base, [
+            outputOptions.browser,
+            outputOptions.server,
+        ]);
     }
     const withProgress = progress ? utils_1.withSpinner : utils_1.withNoProgress;
     // Initial build
@@ -65,7 +68,7 @@ async function* runEsBuildBuildAction(action, options) {
         }
         const ignored = [
             // Ignore the output and cache paths to avoid infinite rebuild cycles
-            outputPath,
+            outputOptions.base,
             cacheOptions.basePath,
             `${workspaceRoot.replace(/\\/g, '/')}/**/.*/**`,
         ];
@@ -113,7 +116,7 @@ async function* runEsBuildBuildAction(action, options) {
     // unit tests which execute the builder and modify the file system programmatically.
     if (writeToFileSystem) {
         // Write output files
-        await (0, utils_1.writeResultFiles)(result.outputFiles, result.assetFiles, outputPath);
+        await (0, utils_1.writeResultFiles)(result.outputFiles, result.assetFiles, outputOptions);
         yield result.output;
     }
     else {
@@ -158,7 +161,7 @@ async function* runEsBuildBuildAction(action, options) {
                 const filesToWrite = writeToFileSystemFilter
                     ? result.outputFiles.filter(writeToFileSystemFilter)
                     : result.outputFiles;
-                await (0, utils_1.writeResultFiles)(filesToWrite, result.assetFiles, outputPath);
+                await (0, utils_1.writeResultFiles)(filesToWrite, result.assetFiles, outputOptions);
                 yield result.output;
             }
             else {

package/src/builders/application/execute-build.js

@@ -92,10 +92,10 @@ async function executeBuild(options, context, rebuildState) {
         return executionResult;
     }
     // Analyze external imports if external options are enabled
-    if (options.externalPackages || options.externalDependencies?.length) {
+    if (options.externalPackages || bundlingResult.externalConfiguration) {
         const { browser = new Set(), server = new Set() } = bundlingResult.externalImports;
-        // TODO: Filter externalImports to generate second argument to support wildcard externalDependency values
-        executionResult.setExternalMetadata([...browser], [...server], options.externalDependencies);
+        // TODO: Filter externalImports to generate third argument to support wildcard externalConfiguration values
+        executionResult.setExternalMetadata([...browser], [...server], bundlingResult.externalConfiguration);
     }
     const { metafile, initialFiles, outputFiles } = bundlingResult;
     executionResult.outputFiles.push(...outputFiles);

package/src/builders/application/index.d.ts

@@ -8,20 +8,21 @@
 import { BuilderContext, BuilderOutput } from '@angular-devkit/architect';
 import type { Plugin } from 'esbuild';
 import { BuildOutputFile } from '../../tools/esbuild/bundler-context';
-import { ApplicationBuilderInternalOptions } from './options';
+import { ApplicationBuilderExtensions, ApplicationBuilderInternalOptions } from './options';
 import { Schema as ApplicationBuilderOptions } from './schema';
 export { ApplicationBuilderOptions };
 export declare function buildApplicationInternal(options: ApplicationBuilderInternalOptions, context: BuilderContext & {
     signal?: AbortSignal;
 }, infrastructureSettings?: {
     write?: boolean;
-}, plugins?: Plugin[]): AsyncIterable<BuilderOutput & {
+}, extensions?: ApplicationBuilderExtensions): AsyncIterable<ApplicationBuilderOutput>;
+export interface ApplicationBuilderOutput extends BuilderOutput {
     outputFiles?: BuildOutputFile[];
     assetFiles?: {
         source: string;
         destination: string;
     }[];
-}>;
+}
 /**
  * Builds an application using the `application` builder with the provided
  * options.
@@ -36,12 +37,21 @@ export declare function buildApplicationInternal(options: ApplicationBuilderInte
  * @param plugins An array of plugins to apply to the main code bundling.
  * @returns The build output results of the build.
  */
-export declare function buildApplication(options: ApplicationBuilderOptions, context: BuilderContext, plugins?: Plugin[]): AsyncIterable<BuilderOutput & {
-    outputFiles?: BuildOutputFile[];
-    assetFiles?: {
-        source: string;
-        destination: string;
-    }[];
-}>;
+export declare function buildApplication(options: ApplicationBuilderOptions, context: BuilderContext, plugins?: Plugin[]): AsyncIterable<ApplicationBuilderOutput>;
+/**
+ * Builds an application using the `application` builder with the provided
+ * options.
+ *
+ * Usage of the `extensions` parameter is NOT supported and may cause unexpected
+ * build output or build failures.
+ *
+ * @experimental Direct usage of this function is considered experimental.
+ *
+ * @param options The options defined by the builder's schema to use.
+ * @param context An Architect builder context instance.
+ * @param extensions An object contain extension points for the build.
+ * @returns The build output results of the build.
+ */
+export declare function buildApplication(options: ApplicationBuilderOptions, context: BuilderContext, extensions?: ApplicationBuilderExtensions): AsyncIterable<ApplicationBuilderOutput>;
 declare const _default: import("../../../../architect/src/internal").Builder<ApplicationBuilderOptions & import("../../../../core/src").JsonObject>;
 export default _default;

package/src/builders/application/index.js

@@ -17,18 +17,38 @@ const execute_build_1 = require("./execute-build");
 const options_1 = require("./options");
 async function* buildApplicationInternal(options, 
 // TODO: Integrate abort signal support into builder system
-context, infrastructureSettings, plugins) {
+context, infrastructureSettings, extensions) {
+    const { workspaceRoot, logger, target } = context;
     // Check Angular version.
-    (0, version_1.assertCompatibleAngularVersion)(context.workspaceRoot);
+    (0, version_1.assertCompatibleAngularVersion)(workspaceRoot);
     // Purge old build disk cache.
     await (0, purge_cache_1.purgeStaleBuildCache)(context);
     // Determine project name from builder context target
-    const projectName = context.target?.project;
+    const projectName = target?.project;
     if (!projectName) {
-        context.logger.error(`The 'application' builder requires a target to be specified.`);
+        yield { success: false, error: `The 'application' builder requires a target to be specified.` };
         return;
     }
-    const normalizedOptions = await (0, options_1.normalizeOptions)(context, projectName, options, plugins);
+    const normalizedOptions = await (0, options_1.normalizeOptions)(context, projectName, options, extensions);
+    const writeToFileSystem = infrastructureSettings?.write ?? true;
+    const writeServerBundles = writeToFileSystem && !!(normalizedOptions.ssrOptions && normalizedOptions.serverEntryPoint);
+    if (writeServerBundles) {
+        const { browser, server } = normalizedOptions.outputOptions;
+        if (browser === '') {
+            yield {
+                success: false,
+                error: `'outputPath.browser' cannot be configured to an empty string when SSR is enabled.`,
+            };
+            return;
+        }
+        if (browser === server) {
+            yield {
+                success: false,
+                error: `'outputPath.browser' and 'outputPath.server' cannot be configured to the same value.`,
+            };
+            return;
+        }
+    }
     // Setup an abort controller with a builder teardown if no signal is present
     let signal = context.signal;
     if (!signal) {
@@ -41,7 +61,7 @@ context, infrastructureSettings, plugins) {
         const result = await (0, execute_build_1.executeBuild)(normalizedOptions, context, rebuildState);
         const buildTime = Number(process.hrtime.bigint() - startTime) / 10 ** 9;
         const status = result.errors.length > 0 ? 'failed' : 'complete';
-        context.logger.info(`Application bundle generation ${status}. [${buildTime.toFixed(3)} seconds]`);
+        logger.info(`Application bundle generation ${status}. [${buildTime.toFixed(3)} seconds]`);
         return result;
     }, {
         watch: normalizedOptions.watch,
@@ -49,38 +69,30 @@ context, infrastructureSettings, plugins) {
         poll: normalizedOptions.poll,
         deleteOutputPath: normalizedOptions.deleteOutputPath,
         cacheOptions: normalizedOptions.cacheOptions,
-        outputPath: normalizedOptions.outputPath,
+        outputOptions: normalizedOptions.outputOptions,
         verbose: normalizedOptions.verbose,
         projectRoot: normalizedOptions.projectRoot,
         workspaceRoot: normalizedOptions.workspaceRoot,
         progress: normalizedOptions.progress,
-        writeToFileSystem: infrastructureSettings?.write,
+        writeToFileSystem,
         // For app-shell and SSG server files are not required by users.
         // Omit these when SSR is not enabled.
-        writeToFileSystemFilter: normalizedOptions.ssrOptions && normalizedOptions.serverEntryPoint
+        writeToFileSystemFilter: writeServerBundles
             ? undefined
             : (file) => file.type !== bundler_context_1.BuildOutputFileType.Server,
-        logger: context.logger,
+        logger,
         signal,
     });
 }
 exports.buildApplicationInternal = buildApplicationInternal;
-/**
- * Builds an application using the `application` builder with the provided
- * options.
- *
- * Usage of the `plugins` parameter is NOT supported and may cause unexpected
- * build output or build failures.
- *
- * @experimental Direct usage of this function is considered experimental.
- *
- * @param options The options defined by the builder's schema to use.
- * @param context An Architect builder context instance.
- * @param plugins An array of plugins to apply to the main code bundling.
- * @returns The build output results of the build.
- */
-function buildApplication(options, context, plugins) {
-    return buildApplicationInternal(options, context, undefined, plugins);
+function buildApplication(options, context, pluginsOrExtensions) {
+    let extensions;
+    if (pluginsOrExtensions && Array.isArray(pluginsOrExtensions)) {
+        extensions = {
+            codePlugins: pluginsOrExtensions,
+        };
+    }
+    return buildApplicationInternal(options, context, undefined, extensions);
 }
 exports.buildApplication = buildApplication;
 exports.default = (0, architect_1.createBuilder)(buildApplication);

package/src/builders/application/options.d.ts

@@ -8,8 +8,14 @@
 import { BuilderContext } from '@angular-devkit/architect';
 import type { Plugin } from 'esbuild';
 import { I18nOptions } from '../../utils/i18n-options';
-import { Schema as ApplicationBuilderOptions, I18NTranslation } from './schema';
+import { IndexHtmlTransform } from '../../utils/index-file/index-html-generator';
+import { Schema as ApplicationBuilderOptions, I18NTranslation, OutputPathClass } from './schema';
+export type NormalizedOutputOptions = Required<OutputPathClass>;
 export type NormalizedApplicationBuildOptions = Awaited<ReturnType<typeof normalizeOptions>>;
+export interface ApplicationBuilderExtensions {
+    codePlugins?: Plugin[];
+    indexHtmlTransformer?: IndexHtmlTransform;
+}
 /** Internal options hidden from builder schema but available when invoked programmatically. */
 interface InternalOptions {
     /**
@@ -51,7 +57,7 @@ export type ApplicationBuilderInternalOptions = Omit<ApplicationBuilderOptions &
  * @param plugins An optional array of programmatically supplied build plugins.
  * @returns An object containing normalized options required to perform the build.
  */
-export declare function normalizeOptions(context: BuilderContext, projectName: string, options: ApplicationBuilderInternalOptions, plugins?: Plugin[]): Promise<{
+export declare function normalizeOptions(context: BuilderContext, projectName: string, options: ApplicationBuilderInternalOptions, extensions?: ApplicationBuilderExtensions): Promise<{
     advancedOptimizations: boolean;
     allowedCommonJsDependencies: string[] | undefined;
     baseHref: string | undefined;
@@ -88,7 +94,7 @@ export declare function normalizeOptions(context: BuilderContext, projectName: s
     workspaceRoot: string;
     entryPoints: Record<string, string>;
     optimizationOptions: import("../../utils").NormalizedOptimizationOptions;
-    outputPath: string;
+    outputOptions: Required<OutputPathClass>;
     outExtension: "js" | "mjs" | undefined;
     sourcemapOptions: import("../..").SourceMapObject;
     tsconfig: string;
@@ -114,6 +120,8 @@ export declare function normalizeOptions(context: BuilderContext, projectName: s
         input: string;
         output: string;
         insertionOrder: import("../../utils/package-chunk-sort").EntryPointsType[];
+        transformer: IndexHtmlTransform | undefined;
+        preloadInitial: boolean;
     } | undefined;
     tailwindConfiguration: {
         file: string;

package/src/builders/application/options.js

@@ -35,7 +35,7 @@ const schema_1 = require("./schema");
  * @returns An object containing normalized options required to perform the build.
  */
 // eslint-disable-next-line max-lines-per-function
-async function normalizeOptions(context, projectName, options, plugins) {
+async function normalizeOptions(context, projectName, options, extensions) {
     // If not explicitly set, default to the Node.js process argument
     const preserveSymlinks = options.preserveSymlinks ?? process.execArgv.includes('--preserve-symlinks');
     // Setup base paths based on workspace root and project information
@@ -59,20 +59,27 @@ async function normalizeOptions(context, projectName, options, plugins) {
     }
     const entryPoints = normalizeEntryPoints(workspaceRoot, options.browser, options.entryPoints);
     const tsconfig = node_path_1.default.join(workspaceRoot, options.tsConfig);
-    const outputPath = normalizeDirectoryPath(node_path_1.default.join(workspaceRoot, options.outputPath));
     const optimizationOptions = (0, utils_1.normalizeOptimization)(options.optimization);
     const sourcemapOptions = (0, utils_1.normalizeSourceMaps)(options.sourceMap ?? false);
     const assets = options.assets?.length
         ? (0, utils_1.normalizeAssetPatterns)(options.assets, workspaceRoot, projectRoot, projectSourceRoot)
         : undefined;
+    const outputPath = options.outputPath;
+    const outputOptions = {
+        browser: 'browser',
+        server: 'server',
+        media: 'media',
+        ...(typeof outputPath === 'string' ? undefined : outputPath),
+        base: normalizeDirectoryPath(node_path_1.default.join(workspaceRoot, typeof outputPath === 'string' ? outputPath : outputPath.base)),
+    };
     const outputNames = {
         bundles: options.outputHashing === schema_1.OutputHashing.All || options.outputHashing === schema_1.OutputHashing.Bundles
             ? '[name]-[hash]'
             : '[name]',
-        media: 'media/' +
+        media: outputOptions.media +
             (options.outputHashing === schema_1.OutputHashing.All || options.outputHashing === schema_1.OutputHashing.Media
-                ? '[name]-[hash]'
-                : '[name]'),
+                ? '/[name]-[hash]'
+                : '/[name]'),
     };
     let fileReplacements;
     if (options.fileReplacements) {
@@ -114,24 +121,6 @@ async function normalizeOptions(context, projectName, options, plugins) {
             globalScripts.push({ name: bundleName, files: paths, initial: inject });
         }
     }
-    let tailwindConfiguration;
-    const tailwindConfigurationPath = await (0, tailwind_1.findTailwindConfigurationFile)(workspaceRoot, projectRoot);
-    if (tailwindConfigurationPath) {
-        // Create a node resolver at the project root as a directory
-        const resolver = (0, node_module_1.createRequire)(projectRoot + '/');
-        try {
-            tailwindConfiguration = {
-                file: tailwindConfigurationPath,
-                package: resolver.resolve('tailwindcss'),
-            };
-        }
-        catch {
-            const relativeTailwindConfigPath = node_path_1.default.relative(workspaceRoot, tailwindConfigurationPath);
-            context.logger.warn(`Tailwind CSS configuration file found (${relativeTailwindConfigPath})` +
-                ` but the 'tailwindcss' package is not installed.` +
-                ` To enable Tailwind CSS, please install the 'tailwindcss' package.`);
-        }
-    }
     let indexHtmlOptions;
     // index can never have a value of `true` but in the schema it's of type `boolean`.
     if (typeof options.index !== 'boolean') {
@@ -144,6 +133,9 @@ async function normalizeOptions(context, projectName, options, plugins) {
                 scripts: options.scripts ?? [],
                 styles: options.styles ?? [],
             }),
+            transformer: extensions?.indexHtmlTransformer,
+            // Preload initial defaults to true
+            preloadInitial: typeof options.index !== 'object' || (options.index.preloadInitial ?? true),
         };
     }
     let serverEntryPoint;
@@ -208,7 +200,7 @@ async function normalizeOptions(context, projectName, options, plugins) {
         workspaceRoot,
         entryPoints,
         optimizationOptions,
-        outputPath,
+        outputOptions,
         outExtension,
         sourcemapOptions,
         tsconfig,
@@ -220,16 +212,37 @@ async function normalizeOptions(context, projectName, options, plugins) {
         globalScripts,
         serviceWorker: typeof serviceWorker === 'string' ? node_path_1.default.join(workspaceRoot, serviceWorker) : undefined,
         indexHtmlOptions,
-        tailwindConfiguration,
+        tailwindConfiguration: await getTailwindConfig(workspaceRoot, projectRoot, context),
         i18nOptions,
         namedChunks,
         budgets: budgets?.length ? budgets : undefined,
         publicPath: deployUrl ? deployUrl : undefined,
-        plugins: plugins?.length ? plugins : undefined,
+        plugins: extensions?.codePlugins?.length ? extensions?.codePlugins : undefined,
         loaderExtensions,
     };
 }
 exports.normalizeOptions = normalizeOptions;
+async function getTailwindConfig(workspaceRoot, projectRoot, context) {
+    const tailwindConfigurationPath = await (0, tailwind_1.findTailwindConfigurationFile)(workspaceRoot, projectRoot);
+    if (!tailwindConfigurationPath) {
+        return undefined;
+    }
+    // Create a node resolver at the project root as a directory
+    const resolver = (0, node_module_1.createRequire)(projectRoot + '/');
+    try {
+        return {
+            file: tailwindConfigurationPath,
+            package: resolver.resolve('tailwindcss'),
+        };
+    }
+    catch {
+        const relativeTailwindConfigPath = node_path_1.default.relative(workspaceRoot, tailwindConfigurationPath);
+        context.logger.warn(`Tailwind CSS configuration file found (${relativeTailwindConfigPath})` +
+            ` but the 'tailwindcss' package is not installed.` +
+            ` To enable Tailwind CSS, please install the 'tailwindcss' package.`);
+    }
+    return undefined;
+}
 /**
  * Normalize entry point options. To maintain compatibility with the legacy browser builder, we need a single `browser`
  * option which defines a single entry point. However, we also want to support multiple entry points as an internal option.

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

@@ -99,9 +99,9 @@ export interface Schema {
      */
     outputHashing?: OutputHashing;
     /**
-     * The full path for the new output directory, relative to the current workspace.
+     * Specify the output path relative to workspace root.
      */
-    outputPath: string;
+    outputPath: OutputPathUnion;
     /**
      * Enable and define the file watching poll time period in milliseconds.
      */
@@ -290,6 +290,11 @@ export interface IndexObject {
      * will be used and will be considered relative to the application's configured output path.
      */
     output?: string;
+    /**
+     * Generates 'preload', `modulepreload', and 'preconnect' link elements for initial
+     * application files and resources.
+     */
+    preloadInitial?: boolean;
     [property: string]: any;
 }
 /**
@@ -369,6 +374,31 @@ export declare enum OutputHashing {
     Media = "media",
     None = "none"
 }
+/**
+ * Specify the output path relative to workspace root.
+ */
+export type OutputPathUnion = OutputPathClass | string;
+export interface OutputPathClass {
+    /**
+     * Specify the output path relative to workspace root.
+     */
+    base: string;
+    /**
+     * The output directory name of your browser build within the output path base. Defaults to
+     * 'browser'.
+     */
+    browser?: string;
+    /**
+     * The output directory name of your media files within the output browser directory.
+     * Defaults to 'media'.
+     */
+    media?: string;
+    /**
+     * The output directory name of your server build within the output path base. Defaults to
+     * 'server'.
+     */
+    server?: string;
+}
 /**
  * Prerender (SSG) pages of your application during build time.
  */

package/src/builders/application/schema.json

@@ -220,8 +220,41 @@
       "default": []
     },
     "outputPath": {
-      "type": "string",
-      "description": "The full path for the new output directory, relative to the current workspace."
+      "description": "Specify the output path relative to workspace root.",
+      "oneOf": [
+        {
+          "type": "object",
+          "properties": {
+            "base": {
+              "type": "string",
+              "description": "Specify the output path relative to workspace root."
+            },
+            "browser": {
+              "type": "string",
+              "pattern": "^[-\\w\\.]*$",
+              "default": "browser",
+              "description": "The output directory name of your browser build within the output path base. Defaults to 'browser'."
+            },
+            "server": {
+              "type": "string",
+              "pattern": "^[-\\w\\.]*$",
+              "default": "server",
+              "description": "The output directory name of your server build within the output path base. Defaults to 'server'."
+            },
+            "media": {
+              "type": "string",
+              "pattern": "^[-\\w\\.]+$",
+              "default": "media",
+              "description": "The output directory name of your media files within the output browser directory. Defaults to 'media'."
+            }
+          },
+          "required": ["base"],
+          "additionalProperties": false
+        },
+        {
+          "type": "string"
+        }
+      ]
     },
     "aot": {
       "type": "boolean",
@@ -383,6 +416,11 @@
               "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."
+            },
+            "preloadInitial": {
+              "type": "boolean",
+              "default": true,
+              "description": "Generates 'preload', `modulepreload', and 'preconnect' link elements for initial application files and resources."
             }
           },
           "required": ["input"]

package/src/builders/browser-esbuild/index.js

@@ -31,13 +31,13 @@ async function* buildEsbuildBrowser(userOptions, context, infrastructureSettings
     (0, builder_status_warnings_1.logBuilderStatusWarnings)(userOptions, context);
     const normalizedOptions = normalizeOptions(userOptions);
     const { deleteOutputPath, outputPath } = normalizedOptions;
-    const fullOutputPath = node_path_1.default.join(context.workspaceRoot, outputPath);
+    const fullOutputPath = node_path_1.default.join(context.workspaceRoot, outputPath.base);
     if (deleteOutputPath && infrastructureSettings?.write !== false) {
-        await (0, utils_2.deleteOutputDir)(context.workspaceRoot, outputPath);
+        await (0, utils_2.deleteOutputDir)(context.workspaceRoot, outputPath.base);
     }
     for await (const result of (0, application_1.buildApplicationInternal)(normalizedOptions, context, {
         write: false,
-    }, plugins)) {
+    }, plugins && { codePlugins: plugins })) {
         if (infrastructureSettings?.write !== false && result.outputFiles) {
             // Write output files
             await writeResultFiles(result.outputFiles, result.assetFiles, fullOutputPath);
@@ -55,11 +55,15 @@ async function* buildEsbuildBrowser(userOptions, context, infrastructureSettings
 }
 exports.buildEsbuildBrowser = buildEsbuildBrowser;
 function normalizeOptions(options) {
-    const { main: browser, ngswConfigPath, serviceWorker, polyfills, ...otherOptions } = options;
+    const { main: browser, outputPath, ngswConfigPath, serviceWorker, polyfills, ...otherOptions } = options;
     return {
         browser,
         serviceWorker: serviceWorker ? ngswConfigPath : false,
         polyfills: typeof polyfills === 'string' ? [polyfills] : polyfills,
+        outputPath: {
+            base: outputPath,
+            browser: '',
+        },
         ...otherOptions,
     };
 }