@angular/build 18.0.0-next.3 → 18.0.0-next.5

package/builders.json

@@ -9,6 +9,11 @@
       "implementation": "./src/builders/dev-server/index",
       "schema": "./src/builders/dev-server/schema.json",
       "description": "Execute a development server for an application."
+    },
+    "extract-i18n": {
+      "implementation": "./src/builders/extract-i18n/index",
+      "schema": "./src/builders/extract-i18n/schema.json",
+      "description": "Extract i18n messages from an application."
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@angular/build",
-  "version": "18.0.0-next.3",
+  "version": "18.0.0-next.5",
   "description": "Official build system for Angular",
   "keywords": [
     "Angular CLI",
@@ -23,21 +23,22 @@
   "builders": "builders.json",
   "dependencies": {
     "@ampproject/remapping": "2.3.0",
-    "@angular-devkit/architect": "0.1800.0-next.3",
+    "@angular-devkit/architect": "0.1800.0-next.5",
     "@babel/core": "7.24.4",
     "@babel/helper-annotate-as-pure": "7.22.5",
     "@babel/helper-split-export-declaration": "7.22.6",
     "@vitejs/plugin-basic-ssl": "1.1.0",
+    "ansi-colors": "4.1.3",
     "browserslist": "^4.23.0",
     "critters": "0.0.22",
     "esbuild": "0.20.2",
     "fast-glob": "3.3.2",
     "https-proxy-agent": "7.0.4",
     "inquirer": "9.2.19",
-    "less": "4.2.0",
     "magic-string": "0.30.10",
     "mrmime": "2.0.0",
     "ora": "5.4.1",
+    "picomatch": "4.0.2",
     "piscina": "4.4.0",
     "parse5-html-rewriting-stream": "7.0.0",
     "postcss": "8.4.38",
@@ -52,6 +53,7 @@
     "@angular/localize": "^18.0.0 || ^18.0.0-next.0",
     "@angular/platform-server": "^18.0.0 || ^18.0.0-next.0",
     "@angular/service-worker": "^18.0.0 || ^18.0.0-next.0",
+    "less": "^4.2.0",
     "tailwindcss": "^2.0.0 || ^3.0.0",
     "typescript": ">=5.4 <5.5"
   },
@@ -65,6 +67,9 @@
     "@angular/service-worker": {
       "optional": true
     },
+    "less": {
+      "optional": true
+    },
     "tailwindcss": {
       "optional": true
     }
@@ -74,7 +79,7 @@
     "url": "https://github.com/angular/angular-cli.git"
   },
   "engines": {
-    "node": "^18.19.1 || >=20.11.1",
+    "node": "^18.19.1 || ^20.11.1 || >=22.0.0",
     "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
     "yarn": ">= 1.13.0"
   },

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

@@ -45,8 +45,8 @@ async function initialize(initialOptions, projectName, context) {
     await (0, internal_1.purgeStaleBuildCache)(context);
     const normalizedOptions = await (0, options_1.normalizeOptions)(context, projectName, initialOptions);
     const builderName = await context.getBuilderNameForTarget(normalizedOptions.buildTarget);
-    if (!normalizedOptions.disableHostCheck &&
-        !/^127\.\d+\.\d+\.\d+/g.test(normalizedOptions.host) &&
+    if (!/^127\.\d+\.\d+\.\d+/g.test(normalizedOptions.host) &&
+        normalizedOptions.host !== '::1' &&
         normalizedOptions.host !== 'localhost') {
         context.logger.warn(`
 Warning: This is a simple server for use in testing or debugging Angular applications
@@ -54,14 +54,9 @@ locally. It hasn't been reviewed for security issues.
 
 Binding this server to an open connection can result in compromising your application or
 computer. Using a different host than the one passed to the "--host" flag might result in
-websocket connection issues. You might need to use "--disable-host-check" if that's the
-case.
+websocket connection issues.
     `);
     }
-    if (normalizedOptions.disableHostCheck) {
-        context.logger.warn('Warning: Running a server with --disable-host-check is a security risk. ' +
-            'See https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a for more information.');
-    }
     normalizedOptions.port = await (0, check_port_1.checkPort)(normalizedOptions.port, normalizedOptions.host);
     return {
         builderName,

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

@@ -34,14 +34,10 @@ export declare function normalizeOptions(context: BuilderContext, projectName: s
     workspaceRoot: string;
     projectRoot: string;
     cacheOptions: import("../../utils/normalize-cache").NormalizedCachedOptions;
-    allowedHosts: string[] | undefined;
-    disableHostCheck: boolean | undefined;
     proxyConfig: string | undefined;
     servePath: string | undefined;
-    publicHost: string | undefined;
     ssl: boolean | undefined;
     sslCert: string | undefined;
     sslKey: string | undefined;
-    forceEsbuild: boolean | undefined;
     prebundle: import("./schema").PrebundleUnion;
 }>;

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

@@ -30,10 +30,10 @@ async function normalizeOptions(context, projectName, options) {
     const projectRoot = node_path_1.default.join(workspaceRoot, projectMetadata.root ?? '');
     const cacheOptions = (0, normalize_cache_1.normalizeCacheOptions)(projectMetadata, workspaceRoot);
     // Target specifier defaults to the current project's build target using a development configuration
-    const buildTargetSpecifier = options.buildTarget ?? options.browserTarget ?? `::development`;
+    const buildTargetSpecifier = options.buildTarget ?? `::development`;
     const buildTarget = (0, architect_1.targetFromTargetString)(buildTargetSpecifier, projectName, 'build');
     // Initial options to keep
-    const { host, port, poll, open, verbose, watch, allowedHosts, disableHostCheck, liveReload, hmr, headers, proxyConfig, servePath, publicHost, ssl, sslCert, sslKey, forceEsbuild, prebundle, } = options;
+    const { host, port, poll, open, verbose, watch, liveReload, hmr, headers, proxyConfig, servePath, ssl, sslCert, sslKey, prebundle, } = options;
     // Return all the normalized options
     return {
         buildTarget,
@@ -49,15 +49,11 @@ async function normalizeOptions(context, projectName, options) {
         workspaceRoot,
         projectRoot,
         cacheOptions,
-        allowedHosts,
-        disableHostCheck,
         proxyConfig,
         servePath,
-        publicHost,
         ssl,
         sslCert,
         sslKey,
-        forceEsbuild,
         // Prebundling defaults to true but requires caching to function
         prebundle: cacheOptions.enabled && (prebundle ?? true),
     };

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

@@ -2,34 +2,12 @@
  * Dev Server target options for Build Facade.
  */
 export interface Schema {
-    /**
-     * List of hosts that are allowed to access the dev server. This option has no effect when
-     * using the 'application' or other esbuild-based builders.
-     */
-    allowedHosts?: string[];
-    /**
-     * A browser builder target to serve in the format of `project:target[:configuration]`. You
-     * can also pass in more than one configuration name as a comma-separated list. Example:
-     * `project:target:production,staging`.
-     * @deprecated Use 'buildTarget' instead.
-     */
-    browserTarget?: string;
     /**
      * A build builder target to serve in the format of `project:target[:configuration]`. You
      * can also pass in more than one configuration name as a comma-separated list. Example:
      * `project:target:production,staging`.
      */
-    buildTarget?: string;
-    /**
-     * Don't verify connected clients are part of allowed hosts. This option has no effect when
-     * using the 'application' or other esbuild-based builders.
-     */
-    disableHostCheck?: boolean;
-    /**
-     * Force the development server to use the 'browser-esbuild' builder when building. This is
-     * a developer preview option for the esbuild-based build system.
-     */
-    forceEsbuild?: boolean;
+    buildTarget: string;
     /**
      * Custom HTTP headers to be added to all responses.
      */
@@ -62,8 +40,7 @@ export interface Schema {
     port?: number;
     /**
      * Enable and control the Vite-based development server's prebundling capabilities. To
-     * enable prebundling, the Angular CLI cache must also be enabled. This option has no effect
-     * when using the 'browser' or other Webpack-based builders.
+     * enable prebundling, the Angular CLI cache must also be enabled.
      */
     prebundle?: PrebundleUnion;
     /**
@@ -71,13 +48,6 @@ export interface Schema {
      * https://angular.io/guide/build#proxying-to-a-backend-server.
      */
     proxyConfig?: string;
-    /**
-     * The URL that the browser client (or live-reload client, if enabled) should use to connect
-     * to the development server. Use for a complex dev server setup, such as one with reverse
-     * proxies. This option has no effect when using the 'application' or other esbuild-based
-     * builders.
-     */
-    publicHost?: string;
     /**
      * The pathname where the application will be served.
      */
@@ -105,8 +75,7 @@ export interface Schema {
 }
 /**
  * Enable and control the Vite-based development server's prebundling capabilities. To
- * enable prebundling, the Angular CLI cache must also be enabled. This option has no effect
- * when using the 'browser' or other Webpack-based builders.
+ * enable prebundling, the Angular CLI cache must also be enabled.
  */
 export type PrebundleUnion = boolean | PrebundleClass;
 export interface PrebundleClass {

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

@@ -4,12 +4,6 @@
   "description": "Dev Server target options for Build Facade.",
   "type": "object",
   "properties": {
-    "browserTarget": {
-      "type": "string",
-      "description": "A browser builder target to serve in the format of `project:target[:configuration]`. You can also pass in more than one configuration name as a comma-separated list. Example: `project:target:production,staging`.",
-      "pattern": "^[^:\\s]+:[^:\\s]+(:[^\\s]+)?$",
-      "x-deprecated": "Use 'buildTarget' instead."
-    },
     "buildTarget": {
       "type": "string",
       "description": "A build builder target to serve in the format of `project:target[:configuration]`. You can also pass in more than one configuration name as a comma-separated list. Example: `project:target:production,staging`.",
@@ -67,27 +61,10 @@
       "description": "Whether to reload the page on change, using live-reload.",
       "default": true
     },
-    "publicHost": {
-      "type": "string",
-      "description": "The URL that the browser client (or live-reload client, if enabled) should use to connect to the development server. Use for a complex dev server setup, such as one with reverse proxies. This option has no effect when using the 'application' or other esbuild-based builders."
-    },
-    "allowedHosts": {
-      "type": "array",
-      "description": "List of hosts that are allowed to access the dev server. This option has no effect when using the 'application' or other esbuild-based builders.",
-      "default": [],
-      "items": {
-        "type": "string"
-      }
-    },
     "servePath": {
       "type": "string",
       "description": "The pathname where the application will be served."
     },
-    "disableHostCheck": {
-      "type": "boolean",
-      "description": "Don't verify connected clients are part of allowed hosts. This option has no effect when using the 'application' or other esbuild-based builders.",
-      "default": false
-    },
     "hmr": {
       "type": "boolean",
       "description": "Enable hot module replacement.",
@@ -102,13 +79,8 @@
       "type": "number",
       "description": "Enable and define the file watching poll time period in milliseconds."
     },
-    "forceEsbuild": {
-      "type": "boolean",
-      "description": "Force the development server to use the 'browser-esbuild' builder when building. This is a developer preview option for the esbuild-based build system.",
-      "default": false
-    },
     "prebundle": {
-      "description": "Enable and control the Vite-based development server's prebundling capabilities. To enable prebundling, the Angular CLI cache must also be enabled. This option has no effect when using the 'browser' or other Webpack-based builders.",
+      "description": "Enable and control the Vite-based development server's prebundling capabilities. To enable prebundling, the Angular CLI cache must also be enabled.",
       "oneOf": [
         { "type": "boolean" },
         {
@@ -127,5 +99,5 @@
     }
   },
   "additionalProperties": false,
-  "anyOf": [{ "required": ["buildTarget"] }, { "required": ["browserTarget"] }]
+  "required": ["buildTarget"]
 }

package/src/builders/extract-i18n/application-extraction.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import type { ɵParsedMessage as LocalizeMessage } from '@angular/localize';
+import type { MessageExtractor } from '@angular/localize/tools';
+import type { BuilderContext, BuilderOutput } from '@angular-devkit/architect';
+import type { ApplicationBuilderExtensions } from '../application/options';
+import type { NormalizedExtractI18nOptions } from './options';
+export declare function extractMessages(options: NormalizedExtractI18nOptions, builderName: string, context: BuilderContext, extractorConstructor: typeof MessageExtractor, extensions?: ApplicationBuilderExtensions): Promise<{
+    builderResult: BuilderOutput;
+    basePath: string;
+    messages: LocalizeMessage[];
+    useLegacyIds: boolean;
+}>;

package/src/builders/extract-i18n/application-extraction.js

@@ -0,0 +1,131 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.extractMessages = void 0;
+const node_assert_1 = __importDefault(require("node:assert"));
+const node_path_1 = __importDefault(require("node:path"));
+const application_1 = require("../application");
+async function extractMessages(options, builderName, context, extractorConstructor, extensions) {
+    const messages = [];
+    // Setup the build options for the application based on the buildTarget option
+    const buildOptions = (await context.validateOptions(await context.getTargetOptions(options.buildTarget), builderName));
+    buildOptions.optimization = false;
+    buildOptions.sourceMap = { scripts: true, vendor: true, styles: false };
+    buildOptions.localize = false;
+    buildOptions.budgets = undefined;
+    buildOptions.index = false;
+    buildOptions.serviceWorker = false;
+    buildOptions.ssr = false;
+    buildOptions.appShell = false;
+    buildOptions.prerender = false;
+    // Build the application with the build options
+    let builderResult;
+    try {
+        for await (const result of (0, application_1.buildApplicationInternal)(buildOptions, context, { write: false }, extensions)) {
+            builderResult = result;
+            break;
+        }
+        (0, node_assert_1.default)(builderResult !== undefined, 'Application builder did not provide a result.');
+    }
+    catch (err) {
+        builderResult = {
+            success: false,
+            error: err.message,
+        };
+    }
+    // Extract messages from each output JavaScript file.
+    // Output files are only present on a successful build.
+    if (builderResult.outputFiles) {
+        // Store the JS and JS map files for lookup during extraction
+        const files = new Map();
+        for (const outputFile of builderResult.outputFiles) {
+            if (outputFile.path.endsWith('.js')) {
+                files.set(outputFile.path, outputFile.text);
+            }
+            else if (outputFile.path.endsWith('.js.map')) {
+                files.set(outputFile.path, outputFile.text);
+            }
+        }
+        // Setup the localize message extractor based on the in-memory files
+        const extractor = setupLocalizeExtractor(extractorConstructor, files, context);
+        // Attempt extraction of all output JS files
+        for (const filePath of files.keys()) {
+            if (!filePath.endsWith('.js')) {
+                continue;
+            }
+            const fileMessages = extractor.extractMessages(filePath);
+            messages.push(...fileMessages);
+        }
+    }
+    return {
+        builderResult,
+        basePath: context.workspaceRoot,
+        messages,
+        // Legacy i18n identifiers are not supported with the new application builder
+        useLegacyIds: false,
+    };
+}
+exports.extractMessages = extractMessages;
+function setupLocalizeExtractor(extractorConstructor, files, context) {
+    // Setup a virtual file system instance for the extractor
+    // * MessageExtractor itself uses readFile, relative and resolve
+    // * Internal SourceFileLoader (sourcemap support) uses dirname, exists, readFile, and resolve
+    const filesystem = {
+        readFile(path) {
+            // Output files are stored as relative to the workspace root
+            const requestedPath = node_path_1.default.relative(context.workspaceRoot, path);
+            const content = files.get(requestedPath);
+            if (content === undefined) {
+                throw new Error('Unknown file requested: ' + requestedPath);
+            }
+            return content;
+        },
+        relative(from, to) {
+            return node_path_1.default.relative(from, to);
+        },
+        resolve(...paths) {
+            return node_path_1.default.resolve(...paths);
+        },
+        exists(path) {
+            // Output files are stored as relative to the workspace root
+            const requestedPath = node_path_1.default.relative(context.workspaceRoot, path);
+            return files.has(requestedPath);
+        },
+        dirname(path) {
+            return node_path_1.default.dirname(path);
+        },
+    };
+    const logger = {
+        // level 2 is warnings
+        level: 2,
+        debug(...args) {
+            // eslint-disable-next-line no-console
+            console.debug(...args);
+        },
+        info(...args) {
+            context.logger.info(args.join(''));
+        },
+        warn(...args) {
+            context.logger.warn(args.join(''));
+        },
+        error(...args) {
+            context.logger.error(args.join(''));
+        },
+    };
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const extractor = new extractorConstructor(filesystem, logger, {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        basePath: context.workspaceRoot,
+        useSourceMaps: true,
+    });
+    return extractor;
+}

package/src/builders/extract-i18n/builder.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import type { BuilderContext, BuilderOutput } from '@angular-devkit/architect';
+import type { ApplicationBuilderExtensions } from '../application/options';
+import { Schema as ExtractI18nBuilderOptions } from './schema';
+/**
+ * @experimental Direct usage of this function is considered experimental.
+ */
+export declare function execute(options: ExtractI18nBuilderOptions, context: BuilderContext, extensions?: ApplicationBuilderExtensions): Promise<BuilderOutput>;

package/src/builders/extract-i18n/builder.js

@@ -0,0 +1,140 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.execute = void 0;
+const node_fs_1 = __importDefault(require("node:fs"));
+const node_path_1 = __importDefault(require("node:path"));
+const load_esm_1 = require("../../utils/load-esm");
+const version_1 = require("../../utils/version");
+const options_1 = require("./options");
+const schema_1 = require("./schema");
+/**
+ * @experimental Direct usage of this function is considered experimental.
+ */
+async function execute(options, context, extensions) {
+    // Determine project name from builder context target
+    const projectName = context.target?.project;
+    if (!projectName) {
+        context.logger.error(`The 'extract-i18n' builder requires a target to be specified.`);
+        return { success: false };
+    }
+    // Check Angular version.
+    (0, version_1.assertCompatibleAngularVersion)(context.workspaceRoot);
+    // Load the Angular localize package.
+    // The package is a peer dependency and might not be present
+    let localizeToolsModule;
+    try {
+        localizeToolsModule =
+            await (0, load_esm_1.loadEsmModule)('@angular/localize/tools');
+    }
+    catch {
+        return {
+            success: false,
+            error: `i18n extraction requires the '@angular/localize' package.` +
+                ` You can add it by using 'ng add @angular/localize'.`,
+        };
+    }
+    // Normalize options
+    const normalizedOptions = await (0, options_1.normalizeOptions)(context, projectName, options);
+    const builderName = await context.getBuilderNameForTarget(normalizedOptions.buildTarget);
+    // Extract messages based on configured builder
+    const { extractMessages } = await Promise.resolve().then(() => __importStar(require('./application-extraction')));
+    const extractionResult = await extractMessages(normalizedOptions, builderName, context, localizeToolsModule.MessageExtractor, extensions);
+    // Return the builder result if it failed
+    if (!extractionResult.builderResult.success) {
+        return extractionResult.builderResult;
+    }
+    // Perform duplicate message checks
+    const { checkDuplicateMessages } = localizeToolsModule;
+    // The filesystem is used to create a relative path for each file
+    // from the basePath.  This relative path is then used in the error message.
+    const checkFileSystem = {
+        relative(from, to) {
+            return node_path_1.default.relative(from, to);
+        },
+    };
+    const diagnostics = checkDuplicateMessages(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    checkFileSystem, extractionResult.messages, 'warning', 
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    extractionResult.basePath);
+    if (diagnostics.messages.length > 0) {
+        context.logger.warn(diagnostics.formatDiagnostics(''));
+    }
+    // Serialize all extracted messages
+    const serializer = await createSerializer(localizeToolsModule, normalizedOptions.format, normalizedOptions.i18nOptions.sourceLocale, extractionResult.basePath, extractionResult.useLegacyIds, diagnostics);
+    const content = serializer.serialize(extractionResult.messages);
+    // Ensure directory exists
+    const outputPath = node_path_1.default.dirname(normalizedOptions.outFile);
+    if (!node_fs_1.default.existsSync(outputPath)) {
+        node_fs_1.default.mkdirSync(outputPath, { recursive: true });
+    }
+    // Write translation file
+    node_fs_1.default.writeFileSync(normalizedOptions.outFile, content);
+    if (normalizedOptions.progress) {
+        context.logger.info(`Extraction Complete. (Messages: ${extractionResult.messages.length})`);
+    }
+    return { success: true, outputPath: normalizedOptions.outFile };
+}
+exports.execute = execute;
+async function createSerializer(localizeToolsModule, format, sourceLocale, basePath, useLegacyIds, diagnostics) {
+    const { XmbTranslationSerializer, LegacyMessageIdMigrationSerializer, ArbTranslationSerializer, Xliff1TranslationSerializer, Xliff2TranslationSerializer, SimpleJsonTranslationSerializer, } = localizeToolsModule;
+    switch (format) {
+        case schema_1.Format.Xmb:
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            return new XmbTranslationSerializer(basePath, useLegacyIds);
+        case schema_1.Format.Xlf:
+        case schema_1.Format.Xlif:
+        case schema_1.Format.Xliff:
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            return new Xliff1TranslationSerializer(sourceLocale, basePath, useLegacyIds, {});
+        case schema_1.Format.Xlf2:
+        case schema_1.Format.Xliff2:
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            return new Xliff2TranslationSerializer(sourceLocale, basePath, useLegacyIds, {});
+        case schema_1.Format.Json:
+            return new SimpleJsonTranslationSerializer(sourceLocale);
+        case schema_1.Format.LegacyMigrate:
+            return new LegacyMessageIdMigrationSerializer(diagnostics);
+        case schema_1.Format.Arb:
+            const fileSystem = {
+                relative(from, to) {
+                    return node_path_1.default.relative(from, to);
+                },
+            };
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            return new ArbTranslationSerializer(sourceLocale, basePath, fileSystem);
+    }
+}

package/src/builders/extract-i18n/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import { execute } from './builder';
+import type { Schema as ExtractI18nBuilderOptions } from './schema';
+export { ExtractI18nBuilderOptions, execute };
+declare const _default: import("../../../../../angular_devkit/architect/src/internal").Builder<ExtractI18nBuilderOptions & import("../../../../../angular_devkit/core/src").JsonObject>;
+export default _default;

package/src/builders/extract-i18n/index.js

@@ -0,0 +1,14 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.execute = void 0;
+const architect_1 = require("@angular-devkit/architect");
+const builder_1 = require("./builder");
+Object.defineProperty(exports, "execute", { enumerable: true, get: function () { return builder_1.execute; } });
+exports.default = (0, architect_1.createBuilder)(builder_1.execute);

package/src/builders/extract-i18n/options.d.ts

@@ -0,0 +1,29 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import { BuilderContext } from '@angular-devkit/architect';
+import { Schema as ExtractI18nOptions, Format } from './schema';
+export type NormalizedExtractI18nOptions = Awaited<ReturnType<typeof normalizeOptions>>;
+/**
+ * Normalize the user provided options by creating full paths for all path based options
+ * and converting multi-form options into a single form that can be directly used
+ * by the build process.
+ *
+ * @param context The context for current builder execution.
+ * @param projectName The name of the project for the current execution.
+ * @param options An object containing the options to use for the build.
+ * @returns An object containing normalized options required to perform the build.
+ */
+export declare function normalizeOptions(context: BuilderContext, projectName: string, options: ExtractI18nOptions): Promise<{
+    workspaceRoot: string;
+    projectRoot: string;
+    buildTarget: import("@angular-devkit/architect").Target;
+    i18nOptions: import("../../utils/i18n-options").I18nOptions;
+    format: Format.Arb | Format.Json | Format.LegacyMigrate | Format.Xliff | Format.Xliff2 | Format.Xmb;
+    outFile: string;
+    progress: boolean;
+}>;

package/src/builders/extract-i18n/options.js

@@ -0,0 +1,83 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.normalizeOptions = void 0;
+const architect_1 = require("@angular-devkit/architect");
+const node_assert_1 = require("node:assert");
+const node_path_1 = __importDefault(require("node:path"));
+const i18n_options_1 = require("../../utils/i18n-options");
+const schema_1 = require("./schema");
+/**
+ * Normalize the user provided options by creating full paths for all path based options
+ * and converting multi-form options into a single form that can be directly used
+ * by the build process.
+ *
+ * @param context The context for current builder execution.
+ * @param projectName The name of the project for the current execution.
+ * @param options An object containing the options to use for the build.
+ * @returns An object containing normalized options required to perform the build.
+ */
+async function normalizeOptions(context, projectName, options) {
+    const workspaceRoot = context.workspaceRoot;
+    const projectMetadata = await context.getProjectMetadata(projectName);
+    const projectRoot = node_path_1.default.join(workspaceRoot, projectMetadata.root ?? '');
+    // Target specifier defaults to the current project's build target with no specified configuration
+    const buildTargetSpecifier = options.buildTarget ?? ':';
+    const buildTarget = (0, architect_1.targetFromTargetString)(buildTargetSpecifier, projectName, 'build');
+    const i18nOptions = (0, i18n_options_1.createI18nOptions)(projectMetadata);
+    // Normalize xliff format extensions
+    let format = options.format;
+    switch (format) {
+        case undefined:
+        // Default format is xliff1
+        case schema_1.Format.Xlf:
+        case schema_1.Format.Xlif:
+        case schema_1.Format.Xliff:
+            format = schema_1.Format.Xliff;
+            break;
+        case schema_1.Format.Xlf2:
+        case schema_1.Format.Xliff2:
+            format = schema_1.Format.Xliff2;
+            break;
+    }
+    let outFile = options.outFile || getDefaultOutFile(format);
+    if (options.outputPath) {
+        outFile = node_path_1.default.join(options.outputPath, outFile);
+    }
+    outFile = node_path_1.default.resolve(context.workspaceRoot, outFile);
+    return {
+        workspaceRoot,
+        projectRoot,
+        buildTarget,
+        i18nOptions,
+        format,
+        outFile,
+        progress: options.progress ?? true,
+    };
+}
+exports.normalizeOptions = normalizeOptions;
+function getDefaultOutFile(format) {
+    switch (format) {
+        case schema_1.Format.Xmb:
+            return 'messages.xmb';
+        case schema_1.Format.Xliff:
+        case schema_1.Format.Xliff2:
+            return 'messages.xlf';
+        case schema_1.Format.Json:
+        case schema_1.Format.LegacyMigrate:
+            return 'messages.json';
+        case schema_1.Format.Arb:
+            return 'messages.arb';
+        default:
+            (0, node_assert_1.fail)(`Invalid Format enum value: ${format}`);
+    }
+}

package/src/builders/extract-i18n/schema.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Extract i18n target options for Build Facade.
+ */
+export interface Schema {
+    /**
+     * A builder target to extract i18n messages in the format of
+     * `project:target[:configuration]`. You can also pass in more than one configuration name
+     * as a comma-separated list. Example: `project:target:production,staging`.
+     */
+    buildTarget: string;
+    /**
+     * Output format for the generated file.
+     */
+    format?: Format;
+    /**
+     * Name of the file to output.
+     */
+    outFile?: string;
+    /**
+     * Path where output will be placed.
+     */
+    outputPath?: string;
+    /**
+     * Log progress to the console.
+     */
+    progress?: boolean;
+}
+/**
+ * Output format for the generated file.
+ */
+export declare enum Format {
+    Arb = "arb",
+    Json = "json",
+    LegacyMigrate = "legacy-migrate",
+    Xlf = "xlf",
+    Xlf2 = "xlf2",
+    Xlif = "xlif",
+    Xliff = "xliff",
+    Xliff2 = "xliff2",
+    Xmb = "xmb"
+}

package/src/builders/extract-i18n/schema.js

@@ -0,0 +1,20 @@
+"use strict";
+// THIS FILE IS AUTOMATICALLY GENERATED. TO UPDATE THIS FILE YOU NEED TO CHANGE THE
+// CORRESPONDING JSON SCHEMA FILE, THEN RUN devkit-admin build (or bazel build ...).
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Format = void 0;
+/**
+ * Output format for the generated file.
+ */
+var Format;
+(function (Format) {
+    Format["Arb"] = "arb";
+    Format["Json"] = "json";
+    Format["LegacyMigrate"] = "legacy-migrate";
+    Format["Xlf"] = "xlf";
+    Format["Xlf2"] = "xlf2";
+    Format["Xlif"] = "xlif";
+    Format["Xliff"] = "xliff";
+    Format["Xliff2"] = "xliff2";
+    Format["Xmb"] = "xmb";
+})(Format || (exports.Format = Format = {}));

package/src/builders/extract-i18n/schema.json

@@ -0,0 +1,34 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema",
+  "title": "Extract i18n Target",
+  "description": "Extract i18n target options for Build Facade.",
+  "type": "object",
+  "properties": {
+    "buildTarget": {
+      "type": "string",
+      "description": "A builder target to extract i18n messages in the format of `project:target[:configuration]`. You can also pass in more than one configuration name as a comma-separated list. Example: `project:target:production,staging`.",
+      "pattern": "^[^:\\s]*:[^:\\s]*(:[^\\s]+)?$"
+    },
+    "format": {
+      "type": "string",
+      "description": "Output format for the generated file.",
+      "default": "xlf",
+      "enum": ["xmb", "xlf", "xlif", "xliff", "xlf2", "xliff2", "json", "arb", "legacy-migrate"]
+    },
+    "progress": {
+      "type": "boolean",
+      "description": "Log progress to the console.",
+      "default": true
+    },
+    "outputPath": {
+      "type": "string",
+      "description": "Path where output will be placed."
+    },
+    "outFile": {
+      "type": "string",
+      "description": "Name of the file to output."
+    }
+  },
+  "additionalProperties": false,
+  "required": ["buildTarget"]
+}

package/src/index.d.ts

@@ -9,3 +9,4 @@ export { buildApplication, type ApplicationBuilderOptions, type ApplicationBuild
 export { type BuildOutputFile, BuildOutputFileType } from './tools/esbuild/bundler-context';
 export type { BuildOutputAsset } from './tools/esbuild/bundler-execution-result';
 export { executeDevServerBuilder, DevServerBuilderOptions, DevServerBuilderOutput, } from './builders/dev-server';
+export { execute as executeExtractI18nBuilder, ExtractI18nBuilderOptions, } from './builders/extract-i18n';

package/src/index.js

@@ -7,10 +7,12 @@
  * found in the LICENSE file at https://angular.io/license
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.executeDevServerBuilder = exports.BuildOutputFileType = exports.buildApplication = void 0;
+exports.executeExtractI18nBuilder = exports.executeDevServerBuilder = exports.BuildOutputFileType = exports.buildApplication = void 0;
 var application_1 = require("./builders/application");
 Object.defineProperty(exports, "buildApplication", { enumerable: true, get: function () { return application_1.buildApplication; } });
 var bundler_context_1 = require("./tools/esbuild/bundler-context");
 Object.defineProperty(exports, "BuildOutputFileType", { enumerable: true, get: function () { return bundler_context_1.BuildOutputFileType; } });
 var dev_server_1 = require("./builders/dev-server");
 Object.defineProperty(exports, "executeDevServerBuilder", { enumerable: true, get: function () { return dev_server_1.executeDevServerBuilder; } });
+var extract_i18n_1 = require("./builders/extract-i18n");
+Object.defineProperty(exports, "executeExtractI18nBuilder", { enumerable: true, get: function () { return extract_i18n_1.execute; } });

package/src/tools/esbuild/stylesheets/less-language.js

@@ -50,7 +50,26 @@ exports.LessStylesheetLanguage = Object.freeze({
     },
 });
 async function compileString(data, filename, options, resolver, unsafeInlineJavaScript) {
-    const less = (lessPreprocessor ??= (await Promise.resolve().then(() => __importStar(require('less')))).default);
+    try {
+        lessPreprocessor ??= (await Promise.resolve().then(() => __importStar(require('less')))).default;
+    }
+    catch {
+        return {
+            errors: [
+                {
+                    text: 'Unable to load the "less" stylesheet preprocessor.',
+                    location: null,
+                    notes: [
+                        {
+                            text: 'Ensure that the "less" Node.js package is installed within the project. ' +
+                                "If not present, installation via the project's package manager should resolve the error.",
+                        },
+                    ],
+                },
+            ],
+        };
+    }
+    const less = lessPreprocessor;
     const resolverPlugin = {
         install({ FileManager }, pluginManager) {
             const resolverFileManager = new (class extends FileManager {

package/src/tools/esbuild/utils.js

@@ -334,7 +334,7 @@ function transformSupportedBrowsersToTargets(supportedBrowsers) {
     return transformed;
 }
 exports.transformSupportedBrowsersToTargets = transformSupportedBrowsersToTargets;
-const SUPPORTED_NODE_VERSIONS = '^18.19.1 || >=20.11.1';
+const SUPPORTED_NODE_VERSIONS = '^18.19.1 || ^20.11.1 || >=22.0.0';
 /**
  * Transform supported Node.js versions to esbuild target.
  * @see https://esbuild.github.io/api/#target

package/src/utils/index-file/augment-index-html.js

@@ -12,6 +12,23 @@ const node_crypto_1 = require("node:crypto");
 const node_path_1 = require("node:path");
 const load_esm_1 = require("../load-esm");
 const html_rewriting_stream_1 = require("./html-rewriting-stream");
+/** A list of valid self closing HTML elements */
+const VALID_SELF_CLOSING_TAGS = new Set([
+    'area',
+    'base',
+    'br',
+    'col',
+    'embed',
+    'hr',
+    'img',
+    'input',
+    'link',
+    'meta',
+    'param',
+    'source',
+    'track',
+    'wbr',
+]);
 /*
  * Helper function used by the IndexHtmlWebpackPlugin.
  * Can also be directly used by builder, e. g. in order to generate an index.html
@@ -120,7 +137,7 @@ async function augmentIndexHtml(params) {
     const baseTagExists = html.includes('<base');
     const foundPreconnects = new Set();
     rewriter
-        .on('startTag', (tag) => {
+        .on('startTag', (tag, rawTagHtml) => {
         switch (tag.tagName) {
             case 'html':
                 // Adjust document locale if specified
@@ -153,6 +170,11 @@ async function augmentIndexHtml(params) {
                     }
                 }
                 break;
+            default:
+                if (tag.selfClosing && !VALID_SELF_CLOSING_TAGS.has(tag.tagName)) {
+                    errors.push(`Invalid self-closing element in index HTML file: '${rawTagHtml}'.`);
+                    return;
+                }
         }
         rewriter.emitStartTag(tag);
     })

package/src/utils/normalize-cache.js

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeCacheOptions = void 0;
 const node_path_1 = require("node:path");
 /** Version placeholder is replaced during the build process with actual package version */
-const VERSION = '18.0.0-next.3';
+const VERSION = '18.0.0-next.5';
 function hasCacheMetadata(value) {
     return (!!value &&
         typeof value === 'object' &&

package/src/utils/version.js

@@ -47,7 +47,13 @@ function assertCompatibleAngularVersion(projectRoot) {
         // repository with the generated development @angular/core npm package which is versioned "0.0.0".
         return;
     }
-    const supportedAngularSemver = projectRequire('@angular-devkit/build-angular/package.json')['peerDependencies']['@angular/compiler-cli'];
+    let supportedAngularSemver;
+    try {
+        supportedAngularSemver = projectRequire('@angular/build/package.json')['peerDependencies']['@angular/compiler-cli'];
+    }
+    catch {
+        supportedAngularSemver = projectRequire('@angular-devkit/build-angular/package.json')['peerDependencies']['@angular/compiler-cli'];
+    }
     const angularVersion = new semver_1.SemVer(angularPkgJson['version']);
     if (!(0, semver_1.satisfies)(angularVersion, supportedAngularSemver, { includePrerelease: true })) {
         console.error(`This version of CLI is only compatible with Angular versions ${supportedAngularSemver},\n` +