@angular/build 19.0.0-next.9 → 19.0.0-rc.1

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

@@ -43,11 +43,10 @@ const javascript_transformer_1 = require("../javascript-transformer");
 const load_result_cache_1 = require("../load-result-cache");
 const profiling_1 = require("../profiling");
 const compilation_state_1 = require("./compilation-state");
-const component_stylesheets_1 = require("./component-stylesheets");
 const file_reference_tracker_1 = require("./file-reference-tracker");
 const jit_plugin_callbacks_1 = require("./jit-plugin-callbacks");
 // eslint-disable-next-line max-lines-per-function
-function createCompilerPlugin(pluginOptions, styleOptions) {
+function createCompilerPlugin(pluginOptions, stylesheetBundler) {
     return {
         name: 'angular-compiler',
         // eslint-disable-next-line max-lines-per-function
@@ -101,8 +100,6 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
             let shouldTsIgnoreJs = true;
             // Determines if transpilation should be handle by TypeScript or esbuild
             let useTypeScriptTranspilation = true;
-            // Track incremental component stylesheet builds
-            const stylesheetBundler = new component_stylesheets_1.ComponentStylesheetBundler(styleOptions, pluginOptions.incremental);
             let sharedTSCompilationState;
             // To fully invalidate files, track resource referenced files and their referencing source
             const referencedFileTracker = new file_reference_tracker_1.FileReferenceTracker();
@@ -121,14 +118,17 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                 // Angular compiler which does not have direct knowledge of transitive resource
                 // dependencies or web worker processing.
                 let modifiedFiles;
-                let invalidatedStylesheetEntries;
                 if (pluginOptions.sourceFileCache?.modifiedFiles.size &&
                     referencedFileTracker &&
                     !pluginOptions.noopTypeScriptCompilation) {
                     // TODO: Differentiate between changed input files and stale output files
                     modifiedFiles = referencedFileTracker.update(pluginOptions.sourceFileCache.modifiedFiles);
                     pluginOptions.sourceFileCache.invalidate(modifiedFiles);
-                    invalidatedStylesheetEntries = stylesheetBundler.invalidate(modifiedFiles);
+                    // External runtime styles are invalidated and rebuilt at the beginning of a rebuild to avoid
+                    // the need to execute the application bundler for component style only changes.
+                    if (!pluginOptions.externalRuntimeStyles) {
+                        stylesheetBundler.invalidate(modifiedFiles);
+                    }
                 }
                 if (!pluginOptions.noopTypeScriptCompilation &&
                     compilation.update &&
@@ -140,7 +140,7 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                     fileReplacements: pluginOptions.fileReplacements,
                     modifiedFiles,
                     sourceFileCache: pluginOptions.sourceFileCache,
-                    async transformStylesheet(data, containingFile, stylesheetFile, order) {
+                    async transformStylesheet(data, containingFile, stylesheetFile, order, className) {
                         let stylesheetResult;
                         // Stylesheet file only exists for external stylesheets
                         if (stylesheetFile) {
@@ -148,8 +148,8 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                         }
                         else {
                             stylesheetResult = await stylesheetBundler.bundleInline(data, containingFile, 
-                            // Inline stylesheets from a template style element are always CSS
-                            containingFile.endsWith('.html') ? 'css' : styleOptions.inlineStyleLanguage, 
+                            // Inline stylesheets from a template style element are always CSS; Otherwise, use default.
+                            containingFile.endsWith('.html') ? 'css' : undefined, 
                             // When external runtime styles are enabled, an identifier for the style that does not change
                             // based on the content is required to avoid emitted JS code changes. Any JS code changes will
                             // invalid the output and force a full page reload for HMR cases. The containing file and order
@@ -158,14 +158,16 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                                 ? (0, node_crypto_1.createHash)('sha-256')
                                     .update(containingFile)
                                     .update((order ?? 0).toString())
+                                    .update(className ?? '')
                                     .digest('hex')
                                 : undefined);
                         }
-                        const { contents, outputFiles, metafile, referencedFiles, errors, warnings } = stylesheetResult;
-                        if (errors) {
-                            (result.errors ??= []).push(...errors);
+                        (result.warnings ??= []).push(...stylesheetResult.warnings);
+                        if (stylesheetResult.errors) {
+                            (result.errors ??= []).push(...stylesheetResult.errors);
+                            return '';
                         }
-                        (result.warnings ??= []).push(...warnings);
+                        const { contents, outputFiles, metafile, referencedFiles } = stylesheetResult;
                         additionalResults.set(stylesheetFile ?? containingFile, {
                             outputFiles,
                             metafile,
@@ -215,7 +217,7 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                 let referencedFiles;
                 let externalStylesheets;
                 try {
-                    const initializationResult = await compilation.initialize(pluginOptions.tsconfig, hostOptions, createCompilerOptionsTransformer(setupWarnings, pluginOptions, preserveSymlinks));
+                    const initializationResult = await compilation.initialize(pluginOptions.tsconfig, hostOptions, createCompilerOptionsTransformer(setupWarnings, pluginOptions, preserveSymlinks, build.initialOptions.conditions));
                     shouldTsIgnoreJs = !initializationResult.compilerOptions.allowJs;
                     // Isolated modules option ensures safe non-TypeScript transpilation.
                     // Typescript printing support for sourcemaps is not yet integrated.
@@ -225,6 +227,10 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                             !!initializationResult.compilerOptions.inlineSourceMap;
                     referencedFiles = initializationResult.referencedFiles;
                     externalStylesheets = initializationResult.externalStylesheets;
+                    if (initializationResult.templateUpdates) {
+                        // Propagate any template updates
+                        initializationResult.templateUpdates.forEach((value, key) => pluginOptions.templateUpdates?.set(key, value));
+                    }
                 }
                 catch (error) {
                     (result.errors ??= []).push({
@@ -250,13 +256,6 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                     for (const [stylesheetFile, externalId] of externalStylesheets) {
                         await bundleExternalStylesheet(stylesheetBundler, stylesheetFile, externalId, result, additionalResults);
                     }
-                    // Process any updated stylesheets
-                    if (invalidatedStylesheetEntries) {
-                        for (const stylesheetFile of invalidatedStylesheetEntries) {
-                            // externalId is already linked in the bundler context so only enabling is required here
-                            await bundleExternalStylesheet(stylesheetBundler, stylesheetFile, true, result, additionalResults);
-                        }
-                    }
                 }
                 // Update TypeScript file output cache for all affected files
                 try {
@@ -344,9 +343,22 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                     // Store as the returned Uint8Array to allow caching the fully transformed code
                     typeScriptFileCache.set(request, contents);
                 }
+                let loader;
+                if (useTypeScriptTranspilation || isJS) {
+                    // TypeScript has transpiled to JS or is already JS
+                    loader = 'js';
+                }
+                else if (request.at(-1) === 'x') {
+                    // TSX and TS have different syntax rules. Only set if input is a TSX file.
+                    loader = 'tsx';
+                }
+                else {
+                    // Otherwise, directly bundle TS
+                    loader = 'ts';
+                }
                 return {
                     contents,
-                    loader: useTypeScriptTranspilation || isJS ? 'js' : 'ts',
+                    loader,
                 };
             });
             build.onLoad({ filter: /\.[cm]?js$/ }, (0, load_result_cache_1.createCachedLoad)(pluginOptions.loadResultCache, async (args) => {
@@ -361,7 +373,7 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
             }));
             // Setup bundling of component templates and stylesheets when in JIT mode
             if (pluginOptions.jit) {
-                (0, jit_plugin_callbacks_1.setupJitPluginCallbacks)(build, stylesheetBundler, additionalResults, styleOptions.inlineStyleLanguage, pluginOptions.loadResultCache);
+                (0, jit_plugin_callbacks_1.setupJitPluginCallbacks)(build, stylesheetBundler, additionalResults, pluginOptions.loadResultCache);
             }
             build.onEnd((result) => {
                 // Ensure other compilations are unblocked if the main compilation throws during start
@@ -384,7 +396,6 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
             });
             build.onDispose(() => {
                 sharedTSCompilationState?.dispose();
-                void stylesheetBundler.dispose();
                 void compilation.close?.();
                 void cacheStore?.close();
             });
@@ -405,17 +416,25 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
     };
 }
 async function bundleExternalStylesheet(stylesheetBundler, stylesheetFile, externalId, result, additionalResults) {
-    const { outputFiles, metafile, errors, warnings } = await stylesheetBundler.bundleFile(stylesheetFile, externalId);
-    if (errors) {
-        (result.errors ??= []).push(...errors);
+    const styleResult = await stylesheetBundler.bundleFile(stylesheetFile, externalId);
+    (result.warnings ??= []).push(...styleResult.warnings);
+    if (styleResult.errors) {
+        (result.errors ??= []).push(...styleResult.errors);
+    }
+    else {
+        const { outputFiles, metafile } = styleResult;
+        // Clear inputs to prevent triggering a rebuild of the application code for component
+        // stylesheet file only changes when the dev server enables the internal-only external
+        // stylesheet option. This does not affect builds since only the dev server can enable
+        // the internal option.
+        metafile.inputs = {};
+        additionalResults.set(stylesheetFile, {
+            outputFiles,
+            metafile,
+        });
     }
-    (result.warnings ??= []).push(...warnings);
-    additionalResults.set(stylesheetFile, {
-        outputFiles,
-        metafile,
-    });
 }
-function createCompilerOptionsTransformer(setupWarnings, pluginOptions, preserveSymlinks) {
+function createCompilerOptionsTransformer(setupWarnings, pluginOptions, preserveSymlinks, customConditions) {
     return (compilerOptions) => {
         // target of 9 is ES2022 (using the number avoids an expensive import of typescript just for an enum)
         if (compilerOptions.target === undefined || compilerOptions.target < 9 /** ES2022 */) {
@@ -463,6 +482,11 @@ function createCompilerOptionsTransformer(setupWarnings, pluginOptions, preserve
                 notes: [{ text: `The 'module' option will be set to 'ES2022' instead.` }],
             });
         }
+        // Synchronize custom resolve conditions.
+        // Set if using the supported bundler resolution mode (bundler is the default in new projects)
+        if (compilerOptions.moduleResolution === 100 /* ModuleResolutionKind.Bundler */) {
+            compilerOptions.customConditions = customConditions;
+        }
         return {
             ...compilerOptions,
             noEmitOnError: false,
@@ -473,6 +497,7 @@ function createCompilerOptionsTransformer(setupWarnings, pluginOptions, preserve
             sourceRoot: undefined,
             preserveSymlinks,
             externalRuntimeStyles: pluginOptions.externalRuntimeStyles,
+            _enableHmr: !!pluginOptions.templateUpdates,
         };
     };
 }

package/src/tools/esbuild/angular/component-stylesheets.d.ts

@@ -5,8 +5,12 @@
  * 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 { OutputFile } from 'esbuild';
+import { BundleContextResult } from '../bundler-context';
 import { BundleStylesheetOptions } from '../stylesheets/bundle-options';
+export type ComponentStylesheetResult = BundleContextResult & {
+    contents: string;
+    referencedFiles: Set<string> | undefined;
+};
 /**
  * Bundles component stylesheets. A stylesheet can be either an inline stylesheet that
  * is contained within the Component's metadata definition or an external file referenced
@@ -15,35 +19,31 @@ import { BundleStylesheetOptions } from '../stylesheets/bundle-options';
 export declare class ComponentStylesheetBundler {
     #private;
     private readonly options;
+    private readonly defaultInlineLanguage;
     private readonly incremental;
     /**
      *
      * @param options An object containing the stylesheet bundling options.
      * @param cache A load result cache to use when bundling.
      */
-    constructor(options: BundleStylesheetOptions, incremental: boolean);
-    bundleFile(entry: string, externalId?: string | boolean): Promise<{
-        errors: import("esbuild").Message[] | undefined;
-        warnings: import("esbuild").Message[];
-        contents: string;
-        outputFiles: OutputFile[];
-        metafile: import("esbuild").Metafile | undefined;
-        referencedFiles: Set<string> | undefined;
-    }>;
-    bundleInline(data: string, filename: string, language: string, externalId?: string): Promise<{
-        errors: import("esbuild").Message[] | undefined;
-        warnings: import("esbuild").Message[];
-        contents: string;
-        outputFiles: OutputFile[];
-        metafile: import("esbuild").Metafile | undefined;
-        referencedFiles: Set<string> | undefined;
-    }>;
+    constructor(options: BundleStylesheetOptions, defaultInlineLanguage: string, incremental: boolean);
+    /**
+     * Bundle a file-based component stylesheet for use within an AOT compiled Angular application.
+     * @param entry The file path of the stylesheet.
+     * @param externalId Either an external identifier string for initial bundling or a boolean for rebuilds, if external.
+     * @param direct If true, the output will be used directly by the builder; false if used inside the compiler plugin.
+     * @returns A component bundle result object.
+     */
+    bundleFile(entry: string, externalId?: string | boolean, direct?: boolean): Promise<ComponentStylesheetResult>;
+    bundleAllFiles(external: boolean, direct: boolean): Promise<ComponentStylesheetResult[]>;
+    bundleInline(data: string, filename: string, language?: string, externalId?: string): Promise<ComponentStylesheetResult>;
     /**
      * Invalidates both file and inline based component style bundling state for a set of modified files.
      * @param files The group of files that have been modified
      * @returns An array of file based stylesheet entries if any were invalidated; otherwise, undefined.
      */
     invalidate(files: Iterable<string>): string[] | undefined;
+    collectReferencedFiles(): string[];
     dispose(): Promise<void>;
     private extractResult;
 }

package/src/tools/esbuild/angular/component-stylesheets.js

@@ -24,6 +24,7 @@ const bundle_options_1 = require("../stylesheets/bundle-options");
  */
 class ComponentStylesheetBundler {
     options;
+    defaultInlineLanguage;
     incremental;
     #fileContexts = new cache_1.MemoryCache();
     #inlineContexts = new cache_1.MemoryCache();
@@ -32,17 +33,26 @@ class ComponentStylesheetBundler {
      * @param options An object containing the stylesheet bundling options.
      * @param cache A load result cache to use when bundling.
      */
-    constructor(options, incremental) {
+    constructor(options, defaultInlineLanguage, incremental) {
         this.options = options;
+        this.defaultInlineLanguage = defaultInlineLanguage;
         this.incremental = incremental;
     }
-    async bundleFile(entry, externalId) {
+    /**
+     * Bundle a file-based component stylesheet for use within an AOT compiled Angular application.
+     * @param entry The file path of the stylesheet.
+     * @param externalId Either an external identifier string for initial bundling or a boolean for rebuilds, if external.
+     * @param direct If true, the output will be used directly by the builder; false if used inside the compiler plugin.
+     * @returns A component bundle result object.
+     */
+    async bundleFile(entry, externalId, direct) {
         const bundlerContext = await this.#fileContexts.getOrCreate(entry, () => {
             return new bundler_context_1.BundlerContext(this.options.workspaceRoot, this.incremental, (loadCache) => {
                 const buildOptions = (0, bundle_options_1.createStylesheetBundleOptions)(this.options, loadCache);
                 if (externalId) {
                     (0, node_assert_1.default)(typeof externalId === 'string', 'Initial external component stylesheets must have a string identifier');
                     buildOptions.entryPoints = { [externalId]: entry };
+                    buildOptions.entryNames = '[name]';
                     delete buildOptions.publicPath;
                 }
                 else {
@@ -51,9 +61,12 @@ class ComponentStylesheetBundler {
                 return buildOptions;
             });
         });
-        return this.extractResult(await bundlerContext.bundle(), bundlerContext.watchFiles, !!externalId);
+        return this.extractResult(await bundlerContext.bundle(), bundlerContext.watchFiles, !!externalId, !!direct);
     }
-    async bundleInline(data, filename, language, externalId) {
+    bundleAllFiles(external, direct) {
+        return Promise.all(Array.from(this.#fileContexts.entries()).map(([entry]) => this.bundleFile(entry, external, direct)));
+    }
+    async bundleInline(data, filename, language = this.defaultInlineLanguage, externalId) {
         // Use a hash of the inline stylesheet content to ensure a consistent identifier. External stylesheets will resolve
         // to the actual stylesheet file path.
         // TODO: Consider xxhash instead for hashing
@@ -70,6 +83,7 @@ class ComponentStylesheetBundler {
                 });
                 if (externalId) {
                     buildOptions.entryPoints = { [externalId]: `${namespace};${entry}` };
+                    buildOptions.entryNames = '[name]';
                     delete buildOptions.publicPath;
                 }
                 else {
@@ -100,7 +114,7 @@ class ComponentStylesheetBundler {
             });
         });
         // Extract the result of the bundling from the output files
-        return this.extractResult(await bundlerContext.bundle(), bundlerContext.watchFiles, !!externalId);
+        return this.extractResult(await bundlerContext.bundle(), bundlerContext.watchFiles, !!externalId, false);
     }
     /**
      * Invalidates both file and inline based component style bundling state for a set of modified files.
@@ -124,61 +138,75 @@ class ComponentStylesheetBundler {
         }
         return entries;
     }
+    collectReferencedFiles() {
+        const files = [];
+        for (const context of this.#fileContexts.values()) {
+            files.push(...context.watchFiles);
+        }
+        return files;
+    }
     async dispose() {
         const contexts = [...this.#fileContexts.values(), ...this.#inlineContexts.values()];
         this.#fileContexts.clear();
         this.#inlineContexts.clear();
         await Promise.allSettled(contexts.map((context) => context.dispose()));
     }
-    extractResult(result, referencedFiles, external) {
+    extractResult(result, referencedFiles, external, direct) {
         let contents = '';
-        let metafile;
         const outputFiles = [];
-        if (!result.errors) {
-            for (const outputFile of result.outputFiles) {
-                const filename = node_path_1.default.basename(outputFile.path);
-                if (outputFile.type === bundler_context_1.BuildOutputFileType.Media || filename.endsWith('.css.map')) {
-                    // The output files could also contain resources (images/fonts/etc.) that were referenced and the map files.
-                    // Clone the output file to avoid amending the original path which would causes problems during rebuild.
-                    const clonedOutputFile = outputFile.clone();
-                    // Needed for Bazel as otherwise the files will not be written in the correct place,
-                    // this is because esbuild will resolve the output file from the outdir which is currently set to `workspaceRoot` twice,
-                    // once in the stylesheet and the other in the application code bundler.
-                    // Ex: `../../../../../app.component.css.map`.
+        const { errors, warnings } = result;
+        if (errors) {
+            return { errors, warnings, referencedFiles, contents: '' };
+        }
+        for (const outputFile of result.outputFiles) {
+            const filename = node_path_1.default.basename(outputFile.path);
+            if (outputFile.type === bundler_context_1.BuildOutputFileType.Media || filename.endsWith('.css.map')) {
+                // The output files could also contain resources (images/fonts/etc.) that were referenced and the map files.
+                // Clone the output file to avoid amending the original path which would causes problems during rebuild.
+                const clonedOutputFile = outputFile.clone();
+                // Needed for Bazel as otherwise the files will not be written in the correct place,
+                // this is because esbuild will resolve the output file from the outdir which is currently set to `workspaceRoot` twice,
+                // once in the stylesheet and the other in the application code bundler.
+                // Ex: `../../../../../app.component.css.map`.
+                if (!direct) {
                     clonedOutputFile.path = node_path_1.default.join(this.options.workspaceRoot, outputFile.path);
-                    outputFiles.push(clonedOutputFile);
                 }
-                else if (filename.endsWith('.css')) {
-                    if (external) {
-                        const clonedOutputFile = outputFile.clone();
+                outputFiles.push(clonedOutputFile);
+            }
+            else if (filename.endsWith('.css')) {
+                if (external) {
+                    const clonedOutputFile = outputFile.clone();
+                    if (!direct) {
                         clonedOutputFile.path = node_path_1.default.join(this.options.workspaceRoot, outputFile.path);
-                        outputFiles.push(clonedOutputFile);
-                        contents = node_path_1.default.posix.join(this.options.publicPath ?? '', filename);
-                    }
-                    else {
-                        contents = outputFile.text;
                     }
+                    outputFiles.push(clonedOutputFile);
+                    contents = node_path_1.default.posix.join(this.options.publicPath ?? '', filename);
                 }
                 else {
-                    throw new Error(`Unexpected non CSS/Media file "${filename}" outputted during component stylesheet processing.`);
+                    contents = outputFile.text;
                 }
             }
-            metafile = result.metafile;
-            // Remove entryPoint fields from outputs to prevent the internal component styles from being
-            // treated as initial files. Also mark the entry as a component resource for stat reporting.
-            Object.values(metafile.outputs).forEach((output) => {
-                delete output.entryPoint;
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                output['ng-component'] = true;
-            });
+            else {
+                throw new Error(`Unexpected non CSS/Media file "${filename}" outputted during component stylesheet processing.`);
+            }
         }
+        const metafile = result.metafile;
+        // Remove entryPoint fields from outputs to prevent the internal component styles from being
+        // treated as initial files. Also mark the entry as a component resource for stat reporting.
+        Object.values(metafile.outputs).forEach((output) => {
+            delete output.entryPoint;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            output['ng-component'] = true;
+        });
         return {
-            errors: result.errors,
-            warnings: result.warnings,
+            errors,
+            warnings,
             contents,
             outputFiles,
             metafile,
             referencedFiles,
+            externalImports: result.externalImports,
+            initialFiles: new Map(),
         };
     }
 }

package/src/tools/esbuild/angular/jit-plugin-callbacks.d.ts

@@ -20,4 +20,4 @@ import { ComponentStylesheetBundler } from './component-stylesheets';
 export declare function setupJitPluginCallbacks(build: PluginBuild, stylesheetBundler: ComponentStylesheetBundler, additionalResultFiles: Map<string, {
     outputFiles?: OutputFile[];
     metafile?: Metafile;
-}>, inlineStyleLanguage: string, loadCache?: LoadResultCache): void;
+}>, loadCache?: LoadResultCache): void;

package/src/tools/esbuild/angular/jit-plugin-callbacks.js

@@ -51,7 +51,7 @@ async function loadEntry(entry, root, skipRead) {
  * @param styleOptions The options to use when bundling stylesheets.
  * @param additionalResultFiles A Map where stylesheet resources will be added.
  */
-function setupJitPluginCallbacks(build, stylesheetBundler, additionalResultFiles, inlineStyleLanguage, loadCache) {
+function setupJitPluginCallbacks(build, stylesheetBundler, additionalResultFiles, loadCache) {
     const root = build.initialOptions.absWorkingDir ?? '';
     // Add a resolve callback to capture and parse any JIT URIs that were added by the
     // JIT resource TypeScript transformer.
@@ -90,9 +90,17 @@ function setupJitPluginCallbacks(build, stylesheetBundler, additionalResultFiles
             stylesheetResult = await stylesheetBundler.bundleFile(entry.path);
         }
         else {
-            stylesheetResult = await stylesheetBundler.bundleInline(entry.contents, entry.path, inlineStyleLanguage);
+            stylesheetResult = await stylesheetBundler.bundleInline(entry.contents, entry.path);
         }
-        const { contents, outputFiles, errors, warnings, metafile, referencedFiles } = stylesheetResult;
+        const { errors, warnings, referencedFiles } = stylesheetResult;
+        if (stylesheetResult.errors) {
+            return {
+                errors,
+                warnings,
+                watchFiles: referencedFiles && [...referencedFiles],
+            };
+        }
+        const { contents, outputFiles, metafile } = stylesheetResult;
         additionalResultFiles.set(entry.path, { outputFiles, metafile });
         return {
             errors,

package/src/tools/esbuild/angular/source-file-cache.d.ts

@@ -14,5 +14,5 @@ export declare class SourceFileCache extends Map<string, ts.SourceFile> {
     readonly loadResultCache: MemoryLoadResultCache;
     referencedFiles?: readonly string[];
     constructor(persistentCachePath?: string | undefined);
-    invalidate(files: Iterable<string>): void;
+    invalidate(files: Iterable<string>): boolean;
 }

package/src/tools/esbuild/angular/source-file-cache.js

@@ -50,16 +50,20 @@ class SourceFileCache extends Map {
         if (files !== this.modifiedFiles) {
             this.modifiedFiles.clear();
         }
+        const extraWatchFiles = new Set(this.referencedFiles?.map(path.normalize));
+        let invalid = false;
         for (let file of files) {
             file = path.normalize(file);
-            this.loadResultCache.invalidate(file);
+            invalid = this.loadResultCache.invalidate(file) || invalid;
+            invalid = extraWatchFiles.has(file) || invalid;
             // Normalize separators to allow matching TypeScript Host paths
             if (USING_WINDOWS) {
                 file = file.replace(WINDOWS_SEP_REGEXP, path.posix.sep);
             }
-            this.delete(file);
+            invalid = this.delete(file) || invalid;
             this.modifiedFiles.add(file);
         }
+        return invalid;
     }
 }
 exports.SourceFileCache = SourceFileCache;

package/src/tools/esbuild/application-code-bundle.d.ts

@@ -7,10 +7,12 @@
  */
 import type { BuildOptions } from 'esbuild';
 import type { NormalizedApplicationBuildOptions } from '../../builders/application/options';
+import { ComponentStylesheetBundler } from './angular/component-stylesheets';
 import { SourceFileCache } from './angular/source-file-cache';
 import { BundlerOptionsFactory } from './bundler-context';
-export declare function createBrowserCodeBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache?: SourceFileCache): BuildOptions;
-export declare function createBrowserPolyfillBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache?: SourceFileCache): BuildOptions | BundlerOptionsFactory | undefined;
-export declare function createServerPolyfillBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache?: SourceFileCache): BundlerOptionsFactory | undefined;
-export declare function createServerMainCodeBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache: SourceFileCache): BuildOptions;
-export declare function createSsrEntryCodeBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache: SourceFileCache): BuildOptions;
+import type { LoadResultCache } from './load-result-cache';
+export declare function createBrowserCodeBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache: SourceFileCache, stylesheetBundler: ComponentStylesheetBundler, templateUpdates: Map<string, string> | undefined): BundlerOptionsFactory;
+export declare function createBrowserPolyfillBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache: SourceFileCache, stylesheetBundler: ComponentStylesheetBundler): BuildOptions | BundlerOptionsFactory | undefined;
+export declare function createServerPolyfillBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], loadResultCache: LoadResultCache | undefined): BundlerOptionsFactory | undefined;
+export declare function createServerMainCodeBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache: SourceFileCache, stylesheetBundler: ComponentStylesheetBundler): BundlerOptionsFactory;
+export declare function createSsrEntryCodeBundleOptions(options: NormalizedApplicationBuildOptions, target: string[], sourceFileCache: SourceFileCache, stylesheetBundler: ComponentStylesheetBundler): BundlerOptionsFactory;