@angular-devkit/build-angular 17.2.2 → 17.3.0-rc.0

package/package.json

@@ -1,92 +1,92 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "17.2.2",
+  "version": "17.3.0-rc.0",
   "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.1702.2",
-    "@angular-devkit/build-webpack": "0.1702.2",
-    "@angular-devkit/core": "17.2.2",
-    "@babel/core": "7.23.9",
+    "@ampproject/remapping": "2.3.0",
+    "@angular-devkit/architect": "0.1703.0-rc.0",
+    "@angular-devkit/build-webpack": "0.1703.0-rc.0",
+    "@angular-devkit/core": "17.3.0-rc.0",
+    "@babel/core": "7.24.0",
     "@babel/generator": "7.23.6",
     "@babel/helper-annotate-as-pure": "7.22.5",
     "@babel/helper-split-export-declaration": "7.22.6",
     "@babel/plugin-transform-async-generator-functions": "7.23.9",
     "@babel/plugin-transform-async-to-generator": "7.23.3",
-    "@babel/plugin-transform-runtime": "7.23.9",
-    "@babel/preset-env": "7.23.9",
-    "@babel/runtime": "7.23.9",
+    "@babel/plugin-transform-runtime": "7.24.0",
+    "@babel/preset-env": "7.24.0",
+    "@babel/runtime": "7.24.0",
     "@discoveryjs/json-ext": "0.5.7",
-    "@ngtools/webpack": "17.2.2",
+    "@ngtools/webpack": "17.3.0-rc.0",
     "@vitejs/plugin-basic-ssl": "1.1.0",
     "ansi-colors": "4.1.3",
-    "autoprefixer": "10.4.17",
+    "autoprefixer": "10.4.18",
     "babel-loader": "9.1.3",
     "babel-plugin-istanbul": "6.1.1",
     "browserslist": "^4.21.5",
     "copy-webpack-plugin": "11.0.0",
     "critters": "0.0.20",
     "css-loader": "6.10.0",
-    "esbuild-wasm": "0.20.0",
+    "esbuild-wasm": "0.20.1",
     "fast-glob": "3.3.2",
-    "https-proxy-agent": "7.0.2",
+    "https-proxy-agent": "7.0.4",
     "http-proxy-middleware": "2.0.6",
-    "inquirer": "9.2.14",
+    "inquirer": "9.2.15",
     "jsonc-parser": "3.2.1",
     "karma-source-map-support": "1.4.0",
     "less": "4.2.0",
     "less-loader": "11.1.0",
     "license-webpack-plugin": "4.0.2",
     "loader-utils": "3.2.1",
-    "magic-string": "0.30.7",
-    "mini-css-extract-plugin": "2.8.0",
+    "magic-string": "0.30.8",
+    "mini-css-extract-plugin": "2.8.1",
     "mrmime": "2.0.0",
     "open": "8.4.2",
     "ora": "5.4.1",
     "parse5-html-rewriting-stream": "7.0.0",
     "picomatch": "4.0.1",
-    "piscina": "4.3.1",
+    "piscina": "4.4.0",
     "postcss": "8.4.35",
-    "postcss-loader": "8.1.0",
+    "postcss-loader": "8.1.1",
     "resolve-url-loader": "5.0.0",
     "rxjs": "7.8.1",
-    "sass": "1.70.0",
-    "sass-loader": "14.1.0",
+    "sass": "1.71.1",
+    "sass-loader": "14.1.1",
     "semver": "7.6.0",
     "source-map-loader": "5.0.0",
     "source-map-support": "0.5.21",
-    "terser": "5.27.0",
+    "terser": "5.28.1",
     "tree-kill": "1.2.2",
     "tslib": "2.6.2",
-    "undici": "6.6.2",
-    "vite": "5.0.12",
+    "undici": "6.7.0",
+    "vite": "5.1.5",
     "watchpack": "2.4.0",
-    "webpack": "5.90.1",
+    "webpack": "5.90.3",
     "webpack-dev-middleware": "6.1.1",
     "webpack-dev-server": "4.15.1",
     "webpack-merge": "5.10.0",
     "webpack-subresource-integrity": "5.1.0"
   },
   "optionalDependencies": {
-    "esbuild": "0.20.0"
+    "esbuild": "0.20.1"
   },
   "peerDependencies": {
-    "@angular/compiler-cli": "^17.0.0",
-    "@angular/localize": "^17.0.0",
-    "@angular/platform-server": "^17.0.0",
-    "@angular/service-worker": "^17.0.0",
+    "@angular/compiler-cli": "^17.0.0 || ^17.3.0-next.0",
+    "@angular/localize": "^17.0.0 || ^17.3.0-next.0",
+    "@angular/platform-server": "^17.0.0 || ^17.3.0-next.0",
+    "@angular/service-worker": "^17.0.0 || ^17.3.0-next.0",
     "@web/test-runner": "^0.18.0",
     "browser-sync": "^3.0.2",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
     "karma": "^6.3.0",
-    "ng-packagr": "^17.0.0",
+    "ng-packagr": "^17.0.0 || ^17.3.0-next.0",
     "protractor": "^7.0.0",
     "tailwindcss": "^2.0.0 || ^3.0.0",
-    "typescript": ">=5.2 <5.4"
+    "typescript": ">=5.2 <5.5"
   },
   "peerDependenciesMeta": {
     "@angular/localize": {

package/src/builders/app-shell/index.js

@@ -69,6 +69,7 @@ async function _renderUniversal(options, context, browserResult, serverResult, s
         filename: require.resolve('./render-worker'),
         maxThreads: 1,
         workerData: { zonePackage },
+        recordTiming: false,
     });
     try {
         for (const { path: outputPath, baseHref } of browserResult.outputs) {

package/src/builders/app-shell/render-worker.js

@@ -76,7 +76,7 @@ async function render({ serverBundlePath, document, url }) {
     }
     // The below should really handled by the framework!!!.
     let timer;
-    const renderingTimeout = new Promise((_, reject) => (timer = setTimeout(() => reject(new Error(`Page ${new URL(url, 'resolve://').pathname} did not render in 30 seconds.`)), 30000)));
+    const renderingTimeout = new Promise((_, reject) => (timer = setTimeout(() => reject(new Error(`Page ${new URL(url, 'resolve://').pathname} did not render in 30 seconds.`)), 30_000)));
     return Promise.race([renderAppPromise, renderingTimeout]).finally(() => clearTimeout(timer));
 }
 function isBootstrapFn(value) {

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

@@ -5,7 +5,7 @@
  * 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 type { BuilderContext } from '@angular-devkit/architect';
 import type { Plugin } from 'esbuild';
 import { I18nOptions } from '../../utils/i18n-options';
 import { IndexHtmlTransform } from '../../utils/index-file/index-html-generator';
@@ -39,10 +39,6 @@ interface InternalOptions {
      * This is only used by the development server which currently only supports a single locale per build.
      */
     forceI18nFlatOutput?: boolean;
-    /**
-     * Allows for usage of the deprecated `deployUrl` option with the compatibility builder `browser-esbuild`.
-     */
-    deployUrl?: string;
 }
 /** Full set of options for `application` builder. */
 export type ApplicationBuilderInternalOptions = Omit<ApplicationBuilderOptions & InternalOptions, 'browser'> & {
@@ -123,7 +119,7 @@ export declare function normalizeOptions(context: BuilderContext, projectName: s
     indexHtmlOptions: {
         input: string;
         output: string;
-        insertionOrder: import("../../utils/package-chunk-sort").EntryPointsType[];
+        insertionOrder: [string, boolean][];
         transformer: IndexHtmlTransform | undefined;
         preloadInitial: boolean;
     } | undefined;

package/src/builders/application/options.js

@@ -15,16 +15,13 @@ const node_fs_1 = require("node:fs");
 const promises_1 = require("node:fs/promises");
 const node_module_1 = require("node:module");
 const node_path_1 = __importDefault(require("node:path"));
-const helpers_1 = require("../../tools/webpack/utils/helpers");
 const utils_1 = require("../../utils");
 const color_1 = require("../../utils/color");
 const environment_options_1 = require("../../utils/environment-options");
 const i18n_options_1 = require("../../utils/i18n-options");
 const normalize_cache_1 = require("../../utils/normalize-cache");
-const package_chunk_sort_1 = require("../../utils/package-chunk-sort");
 const postcss_configuration_1 = require("../../utils/postcss-configuration");
 const tailwind_1 = require("../../utils/tailwind");
-const webpack_browser_config_1 = require("../../utils/webpack-browser-config");
 const schema_1 = require("./schema");
 /**
  * Normalize the user provided options by creating full paths for all path based options
@@ -116,31 +113,24 @@ async function normalizeOptions(context, projectName, options, extensions) {
     const tailwindConfiguration = postcssConfiguration
         ? undefined
         : await getTailwindConfig(workspaceRoot, projectRoot, context);
-    const globalStyles = [];
-    if (options.styles?.length) {
-        const { entryPoints: stylesheetEntrypoints, noInjectNames } = (0, helpers_1.normalizeGlobalStyles)(options.styles || []);
-        for (const [name, files] of Object.entries(stylesheetEntrypoints)) {
-            globalStyles.push({ name, files, initial: !noInjectNames.includes(name) });
-        }
-    }
-    const globalScripts = [];
-    if (options.scripts?.length) {
-        for (const { bundleName, paths, inject } of (0, helpers_1.globalScriptsByBundleName)(options.scripts)) {
-            globalScripts.push({ name: bundleName, files: paths, initial: inject });
-        }
-    }
+    const globalStyles = normalizeGlobalEntries(options.styles, 'styles');
+    const globalScripts = normalizeGlobalEntries(options.scripts, 'scripts');
     let indexHtmlOptions;
     // index can never have a value of `true` but in the schema it's of type `boolean`.
     if (typeof options.index !== 'boolean') {
         indexHtmlOptions = {
-            input: node_path_1.default.join(workspaceRoot, (0, webpack_browser_config_1.getIndexInputFile)(options.index)),
+            input: node_path_1.default.join(workspaceRoot, typeof options.index === 'string' ? options.index : options.index.input),
             // The output file will be created within the configured output path
-            output: (0, webpack_browser_config_1.getIndexOutputFile)(options.index),
-            // TODO: Use existing information from above to create the insertion order
-            insertionOrder: (0, package_chunk_sort_1.generateEntryPoints)({
-                scripts: options.scripts ?? [],
-                styles: options.styles ?? [],
-            }),
+            output: typeof options.index === 'string'
+                ? node_path_1.default.basename(options.index)
+                : options.index.output || 'index.html',
+            insertionOrder: [
+                ['polyfills', true],
+                ...globalStyles.filter((s) => s.initial).map((s) => [s.name, false]),
+                ...globalScripts.filter((s) => s.initial).map((s) => [s.name, false]),
+                ['main', true],
+                // [name, esm]
+            ],
             transformer: extensions?.indexHtmlTransformer,
             // Preload initial defaults to true
             preloadInitial: typeof options.index !== 'object' || (options.index.preloadInitial ?? true),
@@ -225,7 +215,7 @@ async function normalizeOptions(context, projectName, options, extensions) {
         i18nOptions,
         namedChunks,
         budgets: budgets?.length ? budgets : undefined,
-        publicPath: deployUrl ? deployUrl : undefined,
+        publicPath: deployUrl,
         plugins: extensions?.codePlugins?.length ? extensions?.codePlugins : undefined,
         loaderExtensions,
         jsonLogs: environment_options_1.useJSONBuildLogs,
@@ -324,3 +314,33 @@ function normalizeDirectoryPath(path) {
     }
     return path;
 }
+function normalizeGlobalEntries(rawEntries, defaultName) {
+    if (!rawEntries?.length) {
+        return [];
+    }
+    const bundles = new Map();
+    for (const rawEntry of rawEntries) {
+        let entry;
+        if (typeof rawEntry === 'string') {
+            // string entries use default bundle name and inject values
+            entry = { input: rawEntry };
+        }
+        else {
+            entry = rawEntry;
+        }
+        const { bundleName, input, inject = true } = entry;
+        // Non-injected entries default to the file name
+        const name = bundleName || (inject ? defaultName : node_path_1.default.basename(input, node_path_1.default.extname(input)));
+        const existing = bundles.get(name);
+        if (!existing) {
+            bundles.set(name, { name, files: [input], initial: inject });
+            continue;
+        }
+        if (existing.initial !== inject) {
+            throw new Error(`The "${name}" bundle is mixing injected and non-injected entries. ` +
+                'Verify that the project options are correct.');
+        }
+        existing.files.push(input);
+    }
+    return [...bundles.values()];
+}

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

@@ -54,6 +54,12 @@ export interface Schema {
      * Delete the output path before building.
      */
     deleteOutputPath?: boolean;
+    /**
+     * Customize the base path for the URLs of resources in 'index.html' and component
+     * stylesheets. This option is only necessary for specific deployment scenarios, such as
+     * with Angular Elements or when utilizing different CDN locations.
+     */
+    deployUrl?: string;
     /**
      * Exclude the listed external dependencies from being bundled into the bundle. Instead, the
      * created bundle relies on these dependencies to be available during runtime.

package/src/builders/application/schema.json

@@ -33,6 +33,10 @@
       "type": "string",
       "description": "The full path for the TypeScript configuration file, relative to the current workspace."
     },
+    "deployUrl": {
+      "type": "string",
+      "description": "Customize the base path for the URLs of resources in 'index.html' and component stylesheets. This option is only necessary for specific deployment scenarios, such as with Angular Elements or when utilizing different CDN locations."
+    },
     "scripts": {
       "description": "Global scripts to be included in the build.",
       "type": "array",

package/src/builders/browser/index.js

@@ -60,7 +60,7 @@ const webpack_browser_config_1 = require("../../utils/webpack-browser-config");
  * Maximum time in milliseconds for single build/rebuild
  * This accounts for CI variability.
  */
-exports.BUILD_TIMEOUT = 30000;
+exports.BUILD_TIMEOUT = 30_000;
 async function initialize(options, context, webpackConfigurationTransform) {
     const originalOutputPath = options.outputPath;
     // Assets are processed directly by the builder except when watching

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

@@ -41,9 +41,9 @@ export interface Schema {
      */
     deleteOutputPath?: boolean;
     /**
-     * URL where files will be deployed.
-     * @deprecated Use "baseHref" option, "APP_BASE_HREF" DI token or a combination of both
-     * instead. For more information, see https://angular.io/guide/deployment#the-deploy-url.
+     * Customize the base path for the URLs of resources in 'index.html' and component
+     * stylesheets. This option is only necessary for specific deployment scenarios, such as
+     * with Angular Elements or when utilizing different CDN locations.
      */
     deployUrl?: string;
     /**

package/src/builders/browser/schema.json

@@ -270,8 +270,7 @@
     },
     "deployUrl": {
       "type": "string",
-      "description": "URL where files will be deployed.",
-      "x-deprecated": "Use \"baseHref\" option, \"APP_BASE_HREF\" DI token or a combination of both instead. For more information, see https://angular.io/guide/deployment#the-deploy-url."
+      "description": "Customize the base path for the URLs of resources in 'index.html' and component stylesheets. This option is only necessary for specific deployment scenarios, such as with Angular Elements or when utilizing different CDN locations."
     },
     "verbose": {
       "type": "boolean",

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

@@ -41,9 +41,9 @@ export interface Schema {
      */
     deleteOutputPath?: boolean;
     /**
-     * URL where files will be deployed.
-     * @deprecated Use "baseHref" option, "APP_BASE_HREF" DI token or a combination of both
-     * instead. For more information, see https://angular.io/guide/deployment#the-deploy-url.
+     * Customize the base path for the URLs of resources in 'index.html' and component
+     * stylesheets. This option is only necessary for specific deployment scenarios, such as
+     * with Angular Elements or when utilizing different CDN locations.
      */
     deployUrl?: string;
     /**

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

@@ -277,8 +277,7 @@
     },
     "deployUrl": {
       "type": "string",
-      "description": "URL where files will be deployed.",
-      "x-deprecated": "Use \"baseHref\" option, \"APP_BASE_HREF\" DI token or a combination of both instead. For more information, see https://angular.io/guide/deployment#the-deploy-url."
+      "description": "Customize the base path for the URLs of resources in 'index.html' and component stylesheets. This option is only necessary for specific deployment scenarios, such as with Angular Elements or when utilizing different CDN locations."
     },
     "verbose": {
       "type": "boolean",

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

@@ -53,6 +53,8 @@ const browser_esbuild_1 = require("../browser-esbuild");
 async function* serveWithVite(serverOptions, builderName, context, transformers, extensions) {
     // Get the browser configuration from the target name.
     const rawBrowserOptions = (await context.getTargetOptions(serverOptions.buildTarget));
+    // Deploy url is not used in the dev-server.
+    delete rawBrowserOptions.deployUrl;
     const browserOptions = (await context.validateOptions({
         ...rawBrowserOptions,
         watch: serverOptions.watch,
@@ -371,6 +373,10 @@ async function setupServer(serverOptions, outputFiles, assets, preserveSymlinks,
                 // the Vite client-side code for browser reloading. These would be available by default but when
                 // the `allow` option is explicitly configured, they must be included manually.
                 allow: [cacheDir, (0, node_path_1.join)(serverOptions.workspaceRoot, 'node_modules'), ...assets.values()],
+                // Temporary disable cached FS checks.
+                // This is because we configure `config.base` to a virtual directory which causes `getRealPath` to fail.
+                // See: https://github.com/vitejs/vite/blob/b2873ac3936de25ca8784327cb9ef16bd4881805/packages/vite/src/node/fsUtils.ts#L45-L67
+                cachedChecks: false,
             },
             // This is needed when `externalDependencies` is used to prevent Vite load errors.
             // NOTE: If Vite adds direct support for externals, this can be removed.
@@ -472,12 +478,12 @@ function getDepOptimizationConfig({ disabled, exclude, include, target, prebundl
         plugins.unshift((0, rxjs_esm_resolution_plugin_1.createRxjsEsmResolutionPlugin)());
     }
     return {
-        // Only enable with caching since it causes prebundle dependencies to be cached
-        disabled,
         // Exclude any explicitly defined dependencies (currently build defined externals)
         exclude,
+        // NB: to disable the deps optimizer, set optimizeDeps.noDiscovery to true and optimizeDeps.include as undefined.
         // Include all implict dependencies from the external packages internal option
-        include,
+        include: disabled ? undefined : include,
+        noDiscovery: disabled,
         // Add an esbuild plugin to run the Angular linker on dependencies
         esbuildOptions: {
             // Set esbuild supported targets.

package/src/builders/prerender/index.js

@@ -69,6 +69,7 @@ async function getRoutes(indexFile, outputPath, serverBundlePath, options, works
                 serverBundlePath,
                 zonePackage: require.resolve('zone.js', { paths: [workspaceRoot] }),
             },
+            recordTiming: false,
         });
         const extractedRoutes = await renderWorker
             .run({})
@@ -140,6 +141,7 @@ async function _renderUniversal(options, context, browserResult, serverResult, b
         filename: path.join(__dirname, 'render-worker.js'),
         maxThreads: environment_options_1.maxWorkers,
         workerData: { zonePackage },
+        recordTiming: false,
     });
     let routes;
     try {

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

@@ -12,10 +12,9 @@ export interface Schema {
      */
     deleteOutputPath?: boolean;
     /**
-     * URL where files will be deployed.
-     * @deprecated Use "baseHref" browser builder option, "APP_BASE_HREF" DI token or a
-     * combination of both instead. For more information, see
-     * https://angular.io/guide/deployment#the-deploy-url.
+     * Customize the base path for the URLs of resources in 'index.html' and component
+     * stylesheets. This option is only necessary for specific deployment scenarios, such as
+     * with Angular Elements or when utilizing different CDN locations.
      */
     deployUrl?: string;
     /**

package/src/builders/server/schema.json

@@ -121,8 +121,7 @@
     },
     "deployUrl": {
       "type": "string",
-      "description": "URL where files will be deployed.",
-      "x-deprecated": "Use \"baseHref\" browser builder option, \"APP_BASE_HREF\" DI token or a combination of both instead. For more information, see https://angular.io/guide/deployment#the-deploy-url."
+      "description": "Customize the base path for the URLs of resources in 'index.html' and component stylesheets. This option is only necessary for specific deployment scenarios, such as with Angular Elements or when utilizing different CDN locations."
     },
     "vendorChunk": {
       "type": "boolean",

package/src/builders/web-test-runner/index.js

@@ -110,7 +110,7 @@ async function runTests(wtr, testDir, options) {
             ],
             testFramework: {
                 config: {
-                    defaultTimeoutInterval: 5000,
+                    defaultTimeoutInterval: 5_000,
                 },
             },
             nodeResolve: true,

package/src/tools/esbuild/angular/compilation/parallel-compilation.js

@@ -39,6 +39,7 @@ class ParallelCompilation extends angular_compilation_1.AngularCompilation {
             // is used when the Atomics based wait loop is enable.
             useAtomics: !process.versions.webcontainer,
             filename: localRequire.resolve('./parallel-worker'),
+            recordTiming: false,
         });
     }
     initialize(tsconfig, hostOptions, compilerOptionsTransformer) {

package/src/tools/esbuild/angular/compiler-plugin.js

@@ -351,7 +351,7 @@ function createCompilerOptionsTransformer(setupWarnings, pluginOptions, preserve
                 location: { file: pluginOptions.tsconfig },
                 notes: [
                     {
-                        text: 'To control ECMA version and features use the Browerslist configuration. ' +
+                        text: 'To control ECMA version and features use the Browserslist configuration. ' +
                             'For more information, see https://angular.io/guide/build#configuring-browser-compatibility',
                     },
                 ],

package/src/tools/esbuild/application-code-bundle.js

@@ -276,7 +276,6 @@ function getEsBuildCommonOptions(options) {
         },
         loader: loaderExtensions,
         footer,
-        publicPath: options.publicPath,
     };
 }
 function getEsBuildCommonPolyfillsOptions(options, namespace, tryToResolvePolyfillsAsRelative, sourceFileCache) {

package/src/tools/esbuild/bundler-context.js

@@ -277,11 +277,10 @@ class BundlerContext {
             }
         }
         (0, node_assert_1.default)(this.#esbuildOptions, 'esbuild options cannot be undefined.');
-        const { assetNames = '' } = this.#esbuildOptions;
-        const mediaDirname = (0, node_path_1.dirname)(assetNames);
         const outputFiles = result.outputFiles.map((file) => {
             let fileType;
-            if ((0, node_path_1.dirname)(file.path) === mediaDirname) {
+            // All files that are not JS, CSS, WASM, or sourcemaps for them are considered media
+            if (!/\.([cm]?js|css|wasm)(\.map)?$/i.test(file.path)) {
                 fileType = BuildOutputFileType.Media;
             }
             else {

package/src/tools/esbuild/global-styles.js

@@ -15,7 +15,7 @@ const node_assert_1 = __importDefault(require("node:assert"));
 const bundle_options_1 = require("./stylesheets/bundle-options");
 const virtual_module_plugin_1 = require("./virtual-module-plugin");
 function createGlobalStylesBundleOptions(options, target, initial) {
-    const { workspaceRoot, optimizationOptions, sourcemapOptions, outputNames, globalStyles, preserveSymlinks, externalDependencies, stylePreprocessorOptions, tailwindConfiguration, postcssConfiguration, cacheOptions, publicPath, } = options;
+    const { workspaceRoot, optimizationOptions, sourcemapOptions, outputNames, globalStyles, preserveSymlinks, externalDependencies, stylePreprocessorOptions, tailwindConfiguration, postcssConfiguration, cacheOptions, } = options;
     const namespace = 'angular:styles/global';
     const entryPoints = {};
     let found = false;
@@ -48,7 +48,6 @@ function createGlobalStylesBundleOptions(options, target, initial) {
             tailwindConfiguration,
             postcssConfiguration,
             cacheOptions,
-            publicPath,
         }, loadCache);
         // Keep special CSS comments `/*! comment */` in place when `removeSpecialComments` is disabled.
         // These comments are special for a number of CSS tools such as Critters and PurgeCSS.

package/src/tools/esbuild/i18n-inliner.js

@@ -83,6 +83,7 @@ class I18nInliner {
                 shouldOptimize: options.shouldOptimize,
                 files,
             },
+            recordTiming: false,
         });
     }
     /**

package/src/tools/esbuild/javascript-transformer.js

@@ -47,6 +47,7 @@ class JavaScriptTransformer {
             maxThreads: this.maxThreads,
             // Shutdown idle threads after 1 second of inactivity
             idleTimeout: 1000,
+            recordTiming: false,
         });
         return this.#workerPool;
     }

package/src/tools/esbuild/stylesheets/bundle-options.js

@@ -55,6 +55,9 @@ function createStylesheetBundleOptions(options, cache, inlineComponentData) {
         publicPath: options.publicPath,
         conditions: ['style', 'sass', 'less'],
         mainFields: ['style', 'sass'],
+        // Unlike JS, CSS does not have implicit file extensions in the general case.
+        // Preprocessor specific behavior is handled in each stylesheet language plugin.
+        resolveExtensions: [],
         plugins,
     };
 }

package/src/tools/sass/sass-service.d.ts

@@ -5,7 +5,7 @@
  * 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 { CompileResult, StringOptionsWithImporter, StringOptionsWithoutImporter } from 'sass';
+import { CompileResult, StringOptions } from 'sass';
 /**
  * A Sass renderer implementation that provides an interface that can be used by Webpack's
  * `sass-loader`. The implementation uses a Worker thread to perform the Sass rendering
@@ -36,7 +36,7 @@ export declare class SassWorkerImplementation {
      * @param source The contents to compile.
      * @param options The `dart-sass` options to use when rendering the stylesheet.
      */
-    compileStringAsync(source: string, options: StringOptionsWithImporter<'async'> | StringOptionsWithoutImporter<'async'>): Promise<CompileResult>;
+    compileStringAsync(source: string, options: StringOptions<'async'>): Promise<CompileResult>;
     /**
      * Shutdown the Sass render worker.
      * Executing this method will stop any pending render requests.
@@ -45,5 +45,5 @@ export declare class SassWorkerImplementation {
     private createWorker;
     private processImporters;
     private createRequest;
-    private isImporter;
+    private isFileImporter;
 }

package/src/tools/sass/sass-service.js

@@ -185,7 +185,7 @@ class SassWorkerImplementation {
     }
     async processImporters(importers, url, options) {
         for (const importer of importers) {
-            if (this.isImporter(importer)) {
+            if (!this.isFileImporter(importer)) {
                 // Importer
                 throw new Error('Only File Importers are supported.');
             }
@@ -206,8 +206,8 @@ class SassWorkerImplementation {
             importers,
         };
     }
-    isImporter(value) {
-        return 'canonicalize' in value && 'load' in value;
+    isFileImporter(value) {
+        return 'findFileUrl' in value;
     }
 }
 exports.SassWorkerImplementation = SassWorkerImplementation;

package/src/tools/webpack/plugins/javascript-optimizer-plugin.js

@@ -116,6 +116,7 @@ class JavaScriptOptimizerPlugin {
                 const workerPool = new piscina_1.default({
                     filename: workerPath,
                     maxThreads: MAX_OPTIMIZE_WORKERS,
+                    recordTiming: false,
                 });
                 // Enqueue script optimization tasks and update compilation assets as the tasks complete
                 try {

package/src/tools/webpack/plugins/javascript-optimizer-worker.d.ts

@@ -84,7 +84,7 @@ export default function ({ asset, options }: OptimizeRequest): Promise<{
 } | {
     name: string;
     code: string;
-    map: import("@ampproject/remapping/dist/types/source-map").default | undefined;
+    map: import("@ampproject/remapping").SourceMap | undefined;
     errors?: undefined;
 }>;
 export {};

package/src/tools/webpack/plugins/typescript.js

@@ -25,7 +25,7 @@ function createIvyPlugin(wco, aot, tsconfig) {
         // which breaks the deprecated `@Effects` NGRX decorator and potentially other existing code as well.
         compilerOptions.useDefineForClassFields ??= false;
         wco.logger.warn('TypeScript compiler options "target" and "useDefineForClassFields" are set to "ES2022" and ' +
-            '"false" respectively by the Angular CLI. To control ECMA version and features use the Browerslist configuration. ' +
+            '"false" respectively by the Angular CLI. To control ECMA version and features use the Browserslist configuration. ' +
             'For more information, see https://angular.io/guide/build#configuring-browser-compatibility\n' +
             `NOTE: You can set the "target" to "ES2022" in the project's tsconfig to remove this warning.`);
     }

package/src/tools/webpack/utils/stats.js

@@ -36,6 +36,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.webpackStatsLogger = exports.generateBuildEventStats = exports.createWebpackLoggingCallback = exports.statsHasWarnings = exports.statsHasErrors = exports.statsErrorsToString = exports.statsWarningsToString = exports.generateBuildStatsTable = exports.generateEsbuildBuildStatsTable = exports.formatSize = void 0;
 const node_assert_1 = __importDefault(require("node:assert"));
 const path = __importStar(require("node:path"));
+const node_util_1 = require("node:util");
 const utils_1 = require("../../../utils");
 const color_1 = require("../../../utils/color");
 const async_chunks_1 = require("./async-chunks");
@@ -237,7 +238,7 @@ function generateTableText(bundleInfo, colors) {
                 continue;
             }
             const currentLongest = (longest[i] ??= 0);
-            const currentItemLength = (0, color_1.removeColor)(currentItem).length;
+            const currentItemLength = (0, node_util_1.stripVTControlCharacters)(currentItem).length;
             if (currentLongest < currentItemLength) {
                 longest[i] = currentItemLength;
             }
@@ -254,7 +255,7 @@ function generateTableText(bundleInfo, colors) {
             if (skipText(currentItem)) {
                 continue;
             }
-            const currentItemLength = (0, color_1.removeColor)(currentItem).length;
+            const currentItemLength = (0, node_util_1.stripVTControlCharacters)(currentItem).length;
             const stringPad = ' '.repeat(longest[i] - currentItemLength);
             // Values in columns at index 2 and 3 (Raw and Estimated sizes) are always right aligned.
             item[i] = i >= 2 ? stringPad + currentItem : currentItem + stringPad;

package/src/utils/action-executor.js

@@ -29,6 +29,7 @@ class BundleActionExecutor {
             name: 'inlineLocales',
             workerData: this.workerOptions,
             maxThreads: environment_options_1.maxWorkers,
+            recordTiming: false,
         });
         return this.workerPool;
     }

package/src/utils/color.d.ts

@@ -6,6 +6,5 @@
  * found in the LICENSE file at https://angular.io/license
  */
 import * as ansiColors from 'ansi-colors';
-export declare function removeColor(text: string): string;
 declare const colors: typeof ansiColors;
 export { colors };

package/src/utils/color.js

@@ -30,9 +30,9 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.colors = exports.removeColor = void 0;
+exports.colors = void 0;
 const ansiColors = __importStar(require("ansi-colors"));
-const tty_1 = require("tty");
+const node_tty_1 = require("node:tty");
 function supportColor() {
     if (process.env.FORCE_COLOR !== undefined) {
         // 2 colors: FORCE_COLOR = 0 (Disables colors), depth 1
@@ -52,17 +52,11 @@ function supportColor() {
                 return false;
         }
     }
-    if (process.stdout instanceof tty_1.WriteStream) {
-        return process.stdout.getColorDepth() > 1;
+    if (process.stdout instanceof node_tty_1.WriteStream) {
+        return process.stdout.hasColors();
     }
     return false;
 }
-function removeColor(text) {
-    // This has been created because when colors.enabled is false unstyle doesn't work
-    // see: https://github.com/doowb/ansi-colors/blob/a4794363369d7b4d1872d248fc43a12761640d8e/index.js#L38
-    return text.replace(ansiColors.ansiRegex, '');
-}
-exports.removeColor = removeColor;
 // Create a separate instance to prevent unintended global changes to the color configuration
 const colors = ansiColors.create();
 exports.colors = colors;

package/src/utils/index-file/html-rewriting-stream.js

@@ -8,38 +8,21 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.htmlRewritingStream = void 0;
-const stream_1 = require("stream");
+const node_stream_1 = require("node:stream");
+const promises_1 = require("node:stream/promises");
 const load_esm_1 = require("../load-esm");
 async function htmlRewritingStream(content) {
     const { RewritingStream } = await (0, load_esm_1.loadEsmModule)('parse5-html-rewriting-stream');
-    const chunks = [];
     const rewriter = new RewritingStream();
     return {
         rewriter,
-        transformedContent: () => {
-            return new Promise((resolve) => {
-                new stream_1.Readable({
-                    encoding: 'utf8',
-                    read() {
-                        this.push(Buffer.from(content));
-                        this.push(null);
-                    },
-                })
-                    .pipe(rewriter)
-                    .pipe(new stream_1.Writable({
-                    write(chunk, encoding, callback) {
-                        chunks.push(typeof chunk === 'string'
-                            ? Buffer.from(chunk, encoding)
-                            : chunk);
-                        callback();
-                    },
-                    final(callback) {
-                        callback();
-                        resolve(Buffer.concat(chunks).toString());
-                    },
-                }));
-            });
-        },
+        transformedContent: () => (0, promises_1.pipeline)(node_stream_1.Readable.from(content), rewriter, async function (source) {
+            const chunks = [];
+            for await (const chunk of source) {
+                chunks.push(Buffer.from(chunk));
+            }
+            return Buffer.concat(chunks).toString('utf-8');
+        }),
     };
 }
 exports.htmlRewritingStream = htmlRewritingStream;

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

@@ -10,7 +10,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.IndexHtmlGenerator = void 0;
 const promises_1 = require("node:fs/promises");
 const node_path_1 = require("node:path");
-const strip_bom_1 = require("../strip-bom");
 const augment_index_html_1 = require("./augment-index-html");
 const inline_critical_css_1 = require("./inline-critical-css");
 const inline_fonts_1 = require("./inline-fonts");
@@ -37,7 +36,7 @@ class IndexHtmlGenerator {
         ];
     }
     async process(options) {
-        let content = (0, strip_bom_1.stripBom)(await this.readIndex(this.options.indexPath));
+        let content = await this.readIndex(this.options.indexPath);
         const warnings = [];
         const errors = [];
         for (const plugin of this.plugins) {
@@ -71,10 +70,10 @@ class IndexHtmlGenerator {
     }
     async readIndex(path) {
         try {
-            return await (0, promises_1.readFile)(path, 'utf-8');
+            return new TextDecoder('utf-8').decode(await (0, promises_1.readFile)(path));
         }
-        catch {
-            throw new Error(`Failed to read index HTML file "${path}".`);
+        catch (cause) {
+            throw new Error(`Failed to read index HTML file "${path}".`, { cause });
         }
     }
 }

package/src/utils/purge-cache.js

@@ -8,8 +8,8 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.purgeStaleBuildCache = void 0;
-const fs_1 = require("fs");
-const path_1 = require("path");
+const promises_1 = require("node:fs/promises");
+const node_path_1 = require("node:path");
 const normalize_cache_1 = require("./normalize-cache");
 /** Delete stale cache directories used by previous versions of build-angular. */
 async function purgeStaleBuildCache(context) {
@@ -19,17 +19,22 @@ async function purgeStaleBuildCache(context) {
     }
     const metadata = await context.getProjectMetadata(projectName);
     const { basePath, path, enabled } = (0, normalize_cache_1.normalizeCacheOptions)(metadata, context.workspaceRoot);
-    if (!enabled || !(0, fs_1.existsSync)(basePath)) {
+    if (!enabled) {
         return;
     }
-    const entriesToDelete = (await fs_1.promises.readdir(basePath, { withFileTypes: true }))
-        .filter((d) => (0, path_1.join)(basePath, d.name) !== path && d.isDirectory())
-        .map((d) => {
-        const subPath = (0, path_1.join)(basePath, d.name);
-        return fs_1.promises
-            .rm(subPath, { force: true, recursive: true, maxRetries: 3 })
-            .catch(() => void 0);
-    });
-    await Promise.all(entriesToDelete);
+    let baseEntries;
+    try {
+        baseEntries = await (0, promises_1.readdir)(basePath, { withFileTypes: true });
+    }
+    catch {
+        // No purging possible if base path does not exist or cannot otherwise be accessed
+        return;
+    }
+    const entriesToDelete = baseEntries
+        .filter((d) => d.isDirectory())
+        .map((d) => (0, node_path_1.join)(basePath, d.name))
+        .filter((cachePath) => cachePath !== path)
+        .map((stalePath) => (0, promises_1.rm)(stalePath, { force: true, recursive: true, maxRetries: 3 }));
+    await Promise.allSettled(entriesToDelete);
 }
 exports.purgeStaleBuildCache = purgeStaleBuildCache;

package/src/utils/server-rendering/prerender.js

@@ -97,6 +97,7 @@ async function renderPages(sourcemap, allRoutes, maxThreads, workspaceRoot, outp
             document,
         },
         execArgv: workerExecArgv,
+        recordTiming: false,
     });
     try {
         const renderingPromises = [];
@@ -163,6 +164,7 @@ async function getAllRoutes(workspaceRoot, outputFilesForWorker, assetFilesForWo
             verbose,
         },
         execArgv: workerExecArgv,
+        recordTiming: false,
     });
     const { routes: extractedRoutes, warnings } = await renderWorker
         .run({})

package/src/utils/version.js

@@ -9,32 +9,30 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.assertCompatibleAngularVersion = void 0;
 /* eslint-disable no-console */
-const core_1 = require("@angular-devkit/core");
+const node_module_1 = require("node:module");
 const semver_1 = require("semver");
 function assertCompatibleAngularVersion(projectRoot) {
     let angularCliPkgJson;
     let angularPkgJson;
-    const resolveOptions = { paths: [projectRoot] };
+    // Create a custom require function for ESM compliance.
+    // NOTE: The trailing slash is significant.
+    const projectRequire = (0, node_module_1.createRequire)(projectRoot + '/');
     try {
-        const angularPackagePath = require.resolve('@angular/core/package.json', resolveOptions);
-        angularPkgJson = require(angularPackagePath);
+        const angularPackagePath = projectRequire.resolve('@angular/core/package.json');
+        angularPkgJson = projectRequire(angularPackagePath);
     }
     catch {
-        console.error(core_1.tags.stripIndents `
-      You seem to not be depending on "@angular/core". This is an error.
-    `);
+        console.error('You seem to not be depending on "@angular/core". This is an error.');
         process.exit(2);
     }
     if (!(angularPkgJson && angularPkgJson['version'])) {
-        console.error(core_1.tags.stripIndents `
-      Cannot determine versions of "@angular/core".
-      This likely means your local installation is broken. Please reinstall your packages.
-    `);
+        console.error('Cannot determine versions of "@angular/core".\n' +
+            'This likely means your local installation is broken. Please reinstall your packages.');
         process.exit(2);
     }
     try {
-        const angularCliPkgPath = require.resolve('@angular/cli/package.json', resolveOptions);
-        angularCliPkgJson = require(angularCliPkgPath);
+        const angularCliPkgPath = projectRequire.resolve('@angular/cli/package.json');
+        angularCliPkgJson = projectRequire(angularCliPkgPath);
         if (!(angularCliPkgJson && angularCliPkgJson['version'])) {
             return;
         }
@@ -49,16 +47,12 @@ function assertCompatibleAngularVersion(projectRoot) {
         // repository with the generated development @angular/core npm package which is versioned "0.0.0".
         return;
     }
-    const supportedAngularSemver = require('../../package.json')['peerDependencies']['@angular/compiler-cli'];
+    const 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(core_1.tags.stripIndents `
-        This version of CLI is only compatible with Angular versions ${supportedAngularSemver},
-        but Angular version ${angularVersion} was found instead.
-
-        Please visit the link below to find instructions on how to update Angular.
-        https://update.angular.io/
-      ` + '\n');
+        console.error(`This version of CLI is only compatible with Angular versions ${supportedAngularSemver},\n` +
+            `but Angular version ${angularVersion} was found instead.\n` +
+            'Please visit the link below to find instructions on how to update Angular.\nhttps://update.angular.io/');
         process.exit(3);
     }
 }

package/src/utils/strip-bom.d.ts

@@ -1,8 +0,0 @@
-/**
- * @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
- */
-export declare function stripBom(data: string): string;

package/src/utils/strip-bom.js

@@ -1,17 +0,0 @@
-"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.stripBom = void 0;
-// TODO: cleanup this file, it's copied as is from Angular CLI.
-// Strip BOM from file data.
-// https://stackoverflow.com/questions/24356713
-function stripBom(data) {
-    return data.replace(/^\uFEFF/, '');
-}
-exports.stripBom = stripBom;