@angular/build 19.0.0-next.1 → 19.0.0-next.10

package/src/tools/esbuild/budget-stats.js

@@ -28,7 +28,7 @@ function generateBudgetStats(metafile, outputFiles, initialFiles) {
             continue;
         }
         // Exclude server bundles
-        if (type === bundler_context_1.BuildOutputFileType.Server) {
+        if (type === bundler_context_1.BuildOutputFileType.ServerApplication || type === bundler_context_1.BuildOutputFileType.ServerRoot) {
             continue;
         }
         const initialRecord = initialFiles.get(file);

package/src/tools/esbuild/bundler-context.d.ts

@@ -31,9 +31,10 @@ export interface InitialFileRecord {
     depth: number;
 }
 export declare enum BuildOutputFileType {
-    Browser = 1,
-    Media = 2,
-    Server = 3,
+    Browser = 0,
+    Media = 1,
+    ServerApplication = 2,
+    ServerRoot = 3,
     Root = 4
 }
 export interface BuildOutputFile extends OutputFile {

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

@@ -18,9 +18,10 @@ const load_result_cache_1 = require("./load-result-cache");
 const utils_1 = require("./utils");
 var BuildOutputFileType;
 (function (BuildOutputFileType) {
-    BuildOutputFileType[BuildOutputFileType["Browser"] = 1] = "Browser";
-    BuildOutputFileType[BuildOutputFileType["Media"] = 2] = "Media";
-    BuildOutputFileType[BuildOutputFileType["Server"] = 3] = "Server";
+    BuildOutputFileType[BuildOutputFileType["Browser"] = 0] = "Browser";
+    BuildOutputFileType[BuildOutputFileType["Media"] = 1] = "Media";
+    BuildOutputFileType[BuildOutputFileType["ServerApplication"] = 2] = "ServerApplication";
+    BuildOutputFileType[BuildOutputFileType["ServerRoot"] = 3] = "ServerRoot";
     BuildOutputFileType[BuildOutputFileType["Root"] = 4] = "Root";
 })(BuildOutputFileType || (exports.BuildOutputFileType = BuildOutputFileType = {}));
 /**
@@ -138,6 +139,7 @@ class BundlerContext {
         }
         return result;
     }
+    // eslint-disable-next-line max-lines-per-function
     async #performBundle() {
         // Create esbuild options if not present
         if (this.#esbuildOptions === undefined) {
@@ -165,12 +167,6 @@ class BundlerContext {
                 // For non-incremental builds, perform a single build
                 result = await (0, esbuild_1.build)(this.#esbuildOptions);
             }
-            if (this.#platformIsServer) {
-                for (const entry of Object.values(result.metafile.outputs)) {
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    entry['ng-platform-server'] = true;
-                }
-            }
         }
         catch (failure) {
             // Build failures will throw an exception which contains errors/warnings
@@ -280,6 +276,7 @@ class BundlerContext {
         for (const { imports } of Object.values(result.metafile.outputs)) {
             for (const importData of imports) {
                 if (!importData.external ||
+                    utils_1.SERVER_GENERATED_EXTERNALS.has(importData.path) ||
                     (importData.kind !== 'import-statement' &&
                         importData.kind !== 'dynamic-import' &&
                         importData.kind !== 'require-call')) {
@@ -295,13 +292,24 @@ class BundlerContext {
             if (!/\.([cm]?js|css|wasm)(\.map)?$/i.test(file.path)) {
                 fileType = BuildOutputFileType.Media;
             }
+            else if (this.#platformIsServer) {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                fileType = result.metafile['ng-ssr-entry-bundle']
+                    ? BuildOutputFileType.ServerRoot
+                    : BuildOutputFileType.ServerApplication;
+            }
             else {
-                fileType = this.#platformIsServer
-                    ? BuildOutputFileType.Server
-                    : BuildOutputFileType.Browser;
+                fileType = BuildOutputFileType.Browser;
             }
             return (0, utils_1.convertOutputFile)(file, fileType);
         });
+        let externalConfiguration = this.#esbuildOptions.external;
+        if (this.#platformIsServer && externalConfiguration) {
+            externalConfiguration = externalConfiguration.filter((dep) => !utils_1.SERVER_GENERATED_EXTERNALS.has(dep));
+            if (!externalConfiguration.length) {
+                externalConfiguration = undefined;
+            }
+        }
         // Return the successful build results
         return {
             ...result,
@@ -310,7 +318,7 @@ class BundlerContext {
             externalImports: {
                 [this.#platformIsServer ? 'server' : 'browser']: externalImports,
             },
-            externalConfiguration: this.#esbuildOptions.external,
+            externalConfiguration,
             errors: undefined,
         };
     }

package/src/tools/esbuild/bundler-execution-result.d.ts

@@ -24,6 +24,9 @@ export interface ExternalResultMetadata {
     implicitServer: string[];
     explicit: string[];
 }
+export type PrerenderedRoutesRecord = Record<string, {
+    headers?: Record<string, string>;
+}>;
 /**
  * Represents the result of a single builder execute call.
  */
@@ -33,7 +36,7 @@ export declare class ExecutionResult {
     outputFiles: BuildOutputFile[];
     assetFiles: BuildOutputAsset[];
     errors: (Message | PartialMessage)[];
-    prerenderedRoutes: string[];
+    prerenderedRoutes: PrerenderedRoutesRecord;
     warnings: (Message | PartialMessage)[];
     logs: string[];
     externalMetadata?: ExternalResultMetadata;
@@ -46,7 +49,7 @@ export declare class ExecutionResult {
     addLog(value: string): void;
     addError(error: PartialMessage | string): void;
     addErrors(errors: (PartialMessage | string)[]): void;
-    addPrerenderedRoutes(routes: string[]): void;
+    addPrerenderedRoutes(routes: PrerenderedRoutesRecord): void;
     addWarning(error: PartialMessage | string): void;
     addWarnings(errors: (PartialMessage | string)[]): void;
     /**

package/src/tools/esbuild/bundler-execution-result.js

@@ -19,7 +19,7 @@ class ExecutionResult {
     outputFiles = [];
     assetFiles = [];
     errors = [];
-    prerenderedRoutes = [];
+    prerenderedRoutes = {};
     warnings = [];
     logs = [];
     externalMetadata;
@@ -53,9 +53,13 @@ class ExecutionResult {
         }
     }
     addPrerenderedRoutes(routes) {
-        this.prerenderedRoutes.push(...routes);
+        Object.assign(this.prerenderedRoutes, routes);
         // Sort the prerendered routes.
-        this.prerenderedRoutes.sort((a, b) => a.localeCompare(b));
+        const sortedObj = {};
+        for (const key of Object.keys(this.prerenderedRoutes).sort()) {
+            sortedObj[key] = this.prerenderedRoutes[key];
+        }
+        this.prerenderedRoutes = sortedObj;
     }
     addWarning(error) {
         if (typeof error === 'string') {

package/src/tools/esbuild/cache.d.ts

@@ -84,5 +84,10 @@ export declare class MemoryCache<V> extends Cache<V, Map<string, V>> {
      * Provides all the values currently present in the cache instance.
      * @returns An iterable of all values in the cache.
      */
-    values(): IterableIterator<V>;
+    values(): MapIterator<V>;
+    /**
+     * Provides all the keys/values currently present in the cache instance.
+     * @returns An iterable of all key/value pairs in the cache.
+     */
+    entries(): MapIterator<[string, V]>;
 }

package/src/tools/esbuild/cache.js

@@ -88,5 +88,12 @@ class MemoryCache extends Cache {
     values() {
         return this.store.values();
     }
+    /**
+     * Provides all the keys/values currently present in the cache instance.
+     * @returns An iterable of all key/value pairs in the cache.
+     */
+    entries() {
+        return this.store.entries();
+    }
 }
 exports.MemoryCache = MemoryCache;

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

@@ -9,7 +9,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createCompilerPluginOptions = createCompilerPluginOptions;
 function createCompilerPluginOptions(options, target, sourceFileCache) {
-    const { workspaceRoot, optimizationOptions, sourcemapOptions, tsconfig, outputNames, fileReplacements, externalDependencies, preserveSymlinks, stylePreprocessorOptions, advancedOptimizations, inlineStyleLanguage, jit, cacheOptions, tailwindConfiguration, postcssConfiguration, publicPath, } = options;
+    const { workspaceRoot, optimizationOptions, sourcemapOptions, tsconfig, outputNames, fileReplacements, externalDependencies, preserveSymlinks, stylePreprocessorOptions, advancedOptimizations, inlineStyleLanguage, jit, cacheOptions, tailwindConfiguration, postcssConfiguration, publicPath, externalRuntimeStyles, instrumentForCoverage, } = options;
     return {
         // JS/TS options
         pluginOptions: {
@@ -22,6 +22,8 @@ function createCompilerPluginOptions(options, target, sourceFileCache) {
             sourceFileCache,
             loadResultCache: sourceFileCache?.loadResultCache,
             incremental: !!options.watch,
+            externalRuntimeStyles,
+            instrumentForCoverage,
         },
         // Component stylesheet options
         styleOptions: {

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

@@ -12,7 +12,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.I18nInliner = void 0;
 const node_assert_1 = __importDefault(require("node:assert"));
-const piscina_1 = __importDefault(require("piscina"));
+const worker_pool_1 = require("../../utils/worker-pool");
 const bundler_context_1 = require("./bundler-context");
 const utils_1 = require("./utils");
 /**
@@ -36,7 +36,8 @@ class I18nInliner {
         const files = new Map();
         const pendingMaps = [];
         for (const file of options.outputFiles) {
-            if (file.type === bundler_context_1.BuildOutputFileType.Root) {
+            if (file.type === bundler_context_1.BuildOutputFileType.Root || file.type === bundler_context_1.BuildOutputFileType.ServerRoot) {
+                // Skip also the server entry-point.
                 // Skip stats and similar files.
                 continue;
             }
@@ -74,7 +75,7 @@ class I18nInliner {
             }
         }
         this.#localizeFiles = files;
-        this.#workerPool = new piscina_1.default({
+        this.#workerPool = new worker_pool_1.WorkerPool({
             filename: require.resolve('./i18n-inliner-worker'),
             maxThreads,
             // Extract options to ensure only the named options are serialized and sent to the worker
@@ -83,7 +84,6 @@ class I18nInliner {
                 shouldOptimize: options.shouldOptimize,
                 files,
             },
-            recordTiming: false,
         });
     }
     /**

package/src/tools/esbuild/javascript-transformer-worker.d.ts

@@ -14,6 +14,7 @@ interface JavaScriptTransformRequest {
     skipLinker?: boolean;
     sideEffects?: boolean;
     jit: boolean;
+    instrumentForCoverage?: boolean;
 }
 export default function transformJavaScript(request: JavaScriptTransformRequest): Promise<unknown>;
 export {};

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

@@ -63,8 +63,12 @@ async function transformWithBabel(filename, data, options) {
     // @ts-expect-error Import attribute syntax plugin does not currently have type definitions
     const { default: importAttributePlugin } = await Promise.resolve().then(() => __importStar(require('@babel/plugin-syntax-import-attributes')));
     const plugins = [importAttributePlugin];
-    // Lazy load the linker plugin only when linking is required
+    if (options.instrumentForCoverage) {
+        const { default: coveragePlugin } = await Promise.resolve().then(() => __importStar(require('../babel/plugins/add-code-coverage.js')));
+        plugins.push(coveragePlugin);
+    }
     if (shouldLink) {
+        // Lazy load the linker plugin only when linking is required
         const linkerPlugin = await createLinkerPlugin(options);
         plugins.push(linkerPlugin);
     }

package/src/tools/esbuild/javascript-transformer.d.ts

@@ -35,7 +35,7 @@ export declare class JavaScriptTransformer {
      * @param sideEffects If false, and `advancedOptimizations` is enabled tslib decorators are wrapped.
      * @returns A promise that resolves to a UTF-8 encoded Uint8Array containing the result.
      */
-    transformFile(filename: string, skipLinker?: boolean, sideEffects?: boolean): Promise<Uint8Array>;
+    transformFile(filename: string, skipLinker?: boolean, sideEffects?: boolean, instrumentForCoverage?: boolean): Promise<Uint8Array>;
     /**
      * Performs JavaScript transformations on the provided data of a file. The file does not need
      * to exist on the filesystem.
@@ -45,7 +45,7 @@ export declare class JavaScriptTransformer {
      * @param sideEffects If false, and `advancedOptimizations` is enabled tslib decorators are wrapped.
      * @returns A promise that resolves to a UTF-8 encoded Uint8Array containing the result.
      */
-    transformData(filename: string, data: string, skipLinker: boolean, sideEffects?: boolean): Promise<Uint8Array>;
+    transformData(filename: string, data: string, skipLinker: boolean, sideEffects?: boolean, instrumentForCoverage?: boolean): Promise<Uint8Array>;
     /**
      * Stops all active transformation tasks and shuts down all workers.
      * @returns A void promise that resolves when closing is complete.

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

@@ -6,14 +6,11 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.dev/license
  */
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.JavaScriptTransformer = void 0;
 const node_crypto_1 = require("node:crypto");
 const promises_1 = require("node:fs/promises");
-const piscina_1 = __importDefault(require("piscina"));
+const worker_pool_1 = require("../../utils/worker-pool");
 /**
  * A class that performs transformation of JavaScript files and raw data.
  * A worker pool is used to distribute the transformation actions and allow
@@ -41,13 +38,9 @@ class JavaScriptTransformer {
         this.#fileCacheKeyBase = Buffer.from(JSON.stringify(this.#commonOptions), 'utf-8');
     }
     #ensureWorkerPool() {
-        this.#workerPool ??= new piscina_1.default({
+        this.#workerPool ??= new worker_pool_1.WorkerPool({
             filename: require.resolve('./javascript-transformer-worker'),
-            minThreads: 1,
             maxThreads: this.maxThreads,
-            // Shutdown idle threads after 1 second of inactivity
-            idleTimeout: 1000,
-            recordTiming: false,
         });
         return this.#workerPool;
     }
@@ -59,7 +52,7 @@ class JavaScriptTransformer {
      * @param sideEffects If false, and `advancedOptimizations` is enabled tslib decorators are wrapped.
      * @returns A promise that resolves to a UTF-8 encoded Uint8Array containing the result.
      */
-    async transformFile(filename, skipLinker, sideEffects) {
+    async transformFile(filename, skipLinker, sideEffects, instrumentForCoverage) {
         const data = await (0, promises_1.readFile)(filename);
         let result;
         let cacheKey;
@@ -86,6 +79,7 @@ class JavaScriptTransformer {
                 data,
                 skipLinker,
                 sideEffects,
+                instrumentForCoverage,
                 ...this.#commonOptions,
             }, {
                 // The below is disable as with Yarn PNP this causes build failures with the below message
@@ -113,10 +107,10 @@ class JavaScriptTransformer {
      * @param sideEffects If false, and `advancedOptimizations` is enabled tslib decorators are wrapped.
      * @returns A promise that resolves to a UTF-8 encoded Uint8Array containing the result.
      */
-    async transformData(filename, data, skipLinker, sideEffects) {
+    async transformData(filename, data, skipLinker, sideEffects, instrumentForCoverage) {
         // Perform a quick test to determine if the data needs any transformations.
         // This allows directly returning the data without the worker communication overhead.
-        if (skipLinker && !this.#commonOptions.advancedOptimizations) {
+        if (skipLinker && !this.#commonOptions.advancedOptimizations && !instrumentForCoverage) {
             const keepSourcemap = this.#commonOptions.sourcemap &&
                 (!!this.#commonOptions.thirdPartySourcemaps || !/[\\/]node_modules[\\/]/.test(filename));
             return Buffer.from(keepSourcemap ? data : data.replace(/^\/\/# sourceMappingURL=[^\r\n]*/gm, ''), 'utf-8');
@@ -126,6 +120,7 @@ class JavaScriptTransformer {
             data,
             skipLinker,
             sideEffects,
+            instrumentForCoverage,
             ...this.#commonOptions,
         });
     }

package/src/tools/esbuild/utils.d.ts

@@ -47,3 +47,12 @@ export declare function logMessages(logger: BuilderContext['logger'], executionR
  */
 export declare function isZonelessApp(polyfills: string[] | undefined): boolean;
 export declare function getEntryPointName(entryPoint: string): string;
+/**
+ * A set of server-generated dependencies that are treated as external.
+ *
+ * These dependencies are marked as external because they are produced by a
+ * separate bundling process and are not included in the primary bundle. This
+ * ensures that these generated files are resolved from an external source rather
+ * than being part of the main bundle.
+ */
+export declare const SERVER_GENERATED_EXTERNALS: Set<string>;

package/src/tools/esbuild/utils.js

@@ -7,6 +7,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.SERVER_GENERATED_EXTERNALS = void 0;
 exports.logBuildStats = logBuildStats;
 exports.getChunkNameFromMetafile = getChunkNameFromMetafile;
 exports.calculateEstimatedTransferSizes = calculateEstimatedTransferSizes;
@@ -29,6 +30,8 @@ const node_path_1 = require("node:path");
 const node_url_1 = require("node:url");
 const node_zlib_1 = require("node:zlib");
 const semver_1 = require("semver");
+const schema_1 = require("../../builders/application/schema");
+const manifest_1 = require("../../utils/server-rendering/manifest");
 const stats_table_1 = require("../../utils/stats-table");
 const bundler_context_1 = require("./bundler-context");
 function logBuildStats(metafile, outputFiles, initial, budgetFailures, colors, changedFiles, estimatedTransferSizes, ssrOutputEnabled, verbose) {
@@ -45,7 +48,7 @@ function logBuildStats(metafile, outputFiles, initial, budgetFailures, colors, c
             ++unchangedCount;
             continue;
         }
-        const isPlatformServer = type === bundler_context_1.BuildOutputFileType.Server;
+        const isPlatformServer = type === bundler_context_1.BuildOutputFileType.ServerApplication || type === bundler_context_1.BuildOutputFileType.ServerRoot;
         if (isPlatformServer && !ssrOutputEnabled) {
             // Only log server build stats when SSR is enabled.
             continue;
@@ -340,7 +343,7 @@ function getSupportedNodeTargets() {
     return SUPPORTED_NODE_VERSIONS.split('||').map((v) => 'node' + (0, semver_1.coerce)(v)?.version);
 }
 async function createJsonBuildManifest(result, normalizedOptions) {
-    const { colors: color, outputOptions: { base, server, browser }, ssrOptions, } = normalizedOptions;
+    const { colors: color, outputOptions: { base, server, browser }, ssrOptions, outputMode, } = normalizedOptions;
     const { warnings, errors, prerenderedRoutes } = result;
     const manifest = {
         errors: errors.length ? await (0, esbuild_1.formatMessages)(errors, { kind: 'error', color }) : [],
@@ -348,7 +351,9 @@ async function createJsonBuildManifest(result, normalizedOptions) {
         outputPaths: {
             root: (0, node_url_1.pathToFileURL)(base),
             browser: (0, node_url_1.pathToFileURL)((0, node_path_1.join)(base, browser)),
-            server: ssrOptions ? (0, node_url_1.pathToFileURL)((0, node_path_1.join)(base, server)) : undefined,
+            server: outputMode !== schema_1.OutputMode.Static && ssrOptions
+                ? (0, node_url_1.pathToFileURL)((0, node_path_1.join)(base, server))
+                : undefined,
         },
         prerenderedRoutes,
     };
@@ -385,3 +390,16 @@ function getEntryPointName(entryPoint) {
         .replace(/\.[cm]?[jt]s$/, '')
         .replace(/[\\/.]/g, '-');
 }
+/**
+ * A set of server-generated dependencies that are treated as external.
+ *
+ * These dependencies are marked as external because they are produced by a
+ * separate bundling process and are not included in the primary bundle. This
+ * ensures that these generated files are resolved from an external source rather
+ * than being part of the main bundle.
+ */
+exports.SERVER_GENERATED_EXTERNALS = new Set([
+    './polyfills.server.mjs',
+    './' + manifest_1.SERVER_APP_MANIFEST_FILENAME,
+    './' + manifest_1.SERVER_APP_ENGINE_MANIFEST_FILENAME,
+]);

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

@@ -34,17 +34,22 @@ var __disposeResources = (this && this.__disposeResources) || (function (Suppres
             env.error = env.hasError ? new SuppressedError(e, env.error, "An error was suppressed during disposal.") : e;
             env.hasError = true;
         }
+        var r, s = 0;
         function next() {
-            while (env.stack.length) {
-                var rec = env.stack.pop();
+            while (r = env.stack.pop()) {
                 try {
-                    var result = rec.dispose && rec.dispose.call(rec.value);
-                    if (rec.async) return Promise.resolve(result).then(next, function(e) { fail(e); return next(); });
+                    if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next);
+                    if (r.dispose) {
+                        var result = r.dispose.call(r.value);
+                        if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); });
+                    }
+                    else s |= 1;
                 }
                 catch (e) {
                     fail(e);
                 }
             }
+            if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve();
             if (env.hasError) throw env.error;
         }
         return next();
@@ -61,8 +66,8 @@ exports.SassWorkerImplementation = void 0;
 const node_assert_1 = __importDefault(require("node:assert"));
 const node_url_1 = require("node:url");
 const node_worker_threads_1 = require("node:worker_threads");
-const piscina_1 = require("piscina");
 const environment_options_1 = require("../../utils/environment-options");
+const worker_pool_1 = require("../../utils/worker-pool");
 // Polyfill Symbol.dispose if not present
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 Symbol.dispose ??= Symbol('Symbol Dispose');
@@ -85,16 +90,9 @@ class SassWorkerImplementation {
         this.maxThreads = maxThreads;
     }
     #ensureWorkerPool() {
-        this.#workerPool ??= new piscina_1.Piscina({
+        this.#workerPool ??= new worker_pool_1.WorkerPool({
             filename: require.resolve('./worker'),
-            minThreads: 1,
             maxThreads: this.maxThreads,
-            // Web containers do not support transferable objects with receiveOnMessagePort which
-            // is used when the Atomics based wait loop is enable.
-            useAtomics: !process.versions.webcontainer,
-            // Shutdown idle threads after 1 second of inactivity
-            idleTimeout: 1000,
-            recordTiming: false,
         });
         return this.#workerPool;
     }

package/src/tools/sass/worker.d.ts

@@ -5,6 +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.dev/license
  */
+import { RawSourceMap } from '@ampproject/remapping';
 import { MessagePort } from 'node:worker_threads';
 import { SourceSpan, StringOptions } from 'sass';
 import type { SerializableWarningMessage } from './sass-service';
@@ -38,45 +39,25 @@ interface RenderRequestMessage {
      */
     rebase: boolean;
 }
-export default function renderSassStylesheet(request: RenderRequestMessage): Promise<{
+interface RenderResult {
     warnings: SerializableWarningMessage[] | undefined;
     result: {
-        loadedUrls: string[];
         css: string;
-        sourceMap?: import("source-map-js").RawSourceMap;
+        loadedUrls: string[];
+        sourceMap?: RawSourceMap;
     };
-    error?: undefined;
-} | {
+}
+interface RenderError {
     warnings: SerializableWarningMessage[] | undefined;
     error: {
-        span: Omit<SourceSpan, "url"> & {
+        message: string;
+        stack?: string;
+        span?: Omit<SourceSpan, 'url'> & {
             url?: string;
         };
-        message: string;
-        stack: string | undefined;
-        sassMessage: string;
-        sassStack: string;
-    };
-    result?: undefined;
-} | {
-    warnings: SerializableWarningMessage[] | undefined;
-    error: {
-        message: string;
-        stack: string | undefined;
-        span?: undefined;
-        sassMessage?: undefined;
-        sassStack?: undefined;
+        sassMessage?: string;
+        sassStack?: string;
     };
-    result?: undefined;
-} | {
-    warnings: SerializableWarningMessage[] | undefined;
-    error: {
-        message: string;
-        span?: undefined;
-        stack?: undefined;
-        sassMessage?: undefined;
-        sassStack?: undefined;
-    };
-    result?: undefined;
-}>;
+}
+export default function renderSassStylesheet(request: RenderRequestMessage): Promise<RenderResult | RenderError>;
 export {};

package/src/tools/sass/worker.js

@@ -95,6 +95,7 @@ async function renderSassStylesheet(request) {
             warnings,
             result: {
                 ...result,
+                sourceMap: result.sourceMap,
                 // URL is not serializable so to convert to string here and back to URL in the parent.
                 loadedUrls: result.loadedUrls.map((p) => (0, node_url_1.fileURLToPath)(p)),
             },

package/src/tools/vite/middlewares/assets-middleware.d.ts

@@ -7,4 +7,4 @@
  */
 import type { Connect, ViteDevServer } from 'vite';
 import { AngularMemoryOutputFiles } from '../utils';
-export declare function createAngularAssetsMiddleware(server: ViteDevServer, assets: Map<string, string>, outputFiles: AngularMemoryOutputFiles): Connect.NextHandleFunction;
+export declare function createAngularAssetsMiddleware(server: ViteDevServer, assets: Map<string, string>, outputFiles: AngularMemoryOutputFiles, usedComponentStyles: Map<string, string[]>): Connect.NextHandleFunction;

package/src/tools/vite/middlewares/assets-middleware.js

@@ -10,9 +10,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.createAngularAssetsMiddleware = createAngularAssetsMiddleware;
 const mrmime_1 = require("mrmime");
 const node_path_1 = require("node:path");
+const load_esm_1 = require("../../../utils/load-esm");
 const utils_1 = require("../utils");
-function createAngularAssetsMiddleware(server, assets, outputFiles) {
-    return function (req, res, next) {
+function createAngularAssetsMiddleware(server, assets, outputFiles, usedComponentStyles) {
+    return function angularAssetsMiddleware(req, res, next) {
         if (req.url === undefined || res.writableEnded) {
             return;
         }
@@ -47,19 +48,57 @@ function createAngularAssetsMiddleware(server, assets, outputFiles) {
             next();
             return;
         }
+        // Support HTTP HEAD requests for the virtual output files from the Angular build
+        if (req.method === 'HEAD' && outputFiles.get(pathname)?.servable) {
+            // While a GET will also generate content, the rest of the response is equivalent
+            req.method = 'GET';
+        }
         // Resource files are handled directly.
         // Global stylesheets (CSS files) are currently considered resources to workaround
         // dev server sourcemap issues with stylesheets.
         if (extension !== '.js' && extension !== '.html') {
             const outputFile = outputFiles.get(pathname);
             if (outputFile?.servable) {
+                const data = outputFile.contents;
+                if (extension === '.css') {
+                    // Inject component ID for view encapsulation if requested
+                    const componentId = new URL(req.url, 'http://localhost').searchParams.get('ngcomp');
+                    if (componentId !== null) {
+                        // Record the component style usage for HMR updates
+                        const usedIds = usedComponentStyles.get(pathname);
+                        if (usedIds === undefined) {
+                            usedComponentStyles.set(pathname, [componentId]);
+                        }
+                        else {
+                            usedIds.push(componentId);
+                        }
+                        // Shim the stylesheet if a component ID is provided
+                        if (componentId.length > 0) {
+                            // Validate component ID
+                            if (/^[_.\-\p{Letter}\d]+-c\d{9}$/u.test(componentId)) {
+                                (0, load_esm_1.loadEsmModule)('@angular/compiler')
+                                    .then((compilerModule) => {
+                                    const encapsulatedData = compilerModule.encapsulateStyle(new TextDecoder().decode(data), componentId);
+                                    res.setHeader('Content-Type', 'text/css');
+                                    res.setHeader('Cache-Control', 'no-cache');
+                                    res.end(encapsulatedData);
+                                })
+                                    .catch((e) => next(e));
+                                return;
+                            }
+                            else {
+                                // eslint-disable-next-line no-console
+                                console.error('Invalid component stylesheet ID request: ' + componentId);
+                            }
+                        }
+                    }
+                }
                 const mimeType = (0, mrmime_1.lookup)(extension);
                 if (mimeType) {
                     res.setHeader('Content-Type', mimeType);
                 }
                 res.setHeader('Cache-Control', 'no-cache');
-                (0, utils_1.appendServerConfiguredHeaders)(server, res);
-                res.end(outputFile.contents);
+                res.end(data);
                 return;
             }
         }