@angular/build 19.0.0 → 19.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@angular/build",
-  "version": "19.0.0",
+  "version": "19.0.2",
   "description": "Official build system for Angular",
   "keywords": [
     "Angular CLI",
@@ -23,7 +23,7 @@
   "builders": "builders.json",
   "dependencies": {
     "@ampproject/remapping": "2.3.0",
-    "@angular-devkit/architect": "0.1900.0",
+    "@angular-devkit/architect": "0.1900.2",
     "@babel/core": "7.26.0",
     "@babel/helper-annotate-as-pure": "7.25.9",
     "@babel/helper-split-export-declaration": "7.24.7",
@@ -57,7 +57,7 @@
     "@angular/localize": "^19.0.0",
     "@angular/platform-server": "^19.0.0",
     "@angular/service-worker": "^19.0.0",
-    "@angular/ssr": "^19.0.0",
+    "@angular/ssr": "^19.0.2",
     "less": "^4.2.0",
     "postcss": "^8.4.0",
     "tailwindcss": "^2.0.0 || ^3.0.0",

package/src/private.d.ts

@@ -11,6 +11,8 @@
  * All exports are not supported for external use, do not provide SemVer guarantees, and
  * their existence may change in any future version.
  */
+import { CompilerPluginOptions } from './tools/esbuild/angular/compiler-plugin';
+import { BundleStylesheetOptions } from './tools/esbuild/stylesheets/bundle-options';
 export { buildApplicationInternal } from './builders/application';
 export type { ApplicationBuilderInternalOptions } from './builders/application/options';
 export { type Result, type ResultFile, ResultKind } from './builders/application/results';
@@ -23,7 +25,9 @@ export { SassWorkerImplementation } from './tools/sass/sass-service';
 export { SourceFileCache } from './tools/esbuild/angular/source-file-cache';
 export { createJitResourceTransformer } from './tools/angular/transformers/jit-resource-transformer';
 export { JavaScriptTransformer } from './tools/esbuild/javascript-transformer';
-export { createCompilerPlugin } from './tools/esbuild/angular/compiler-plugin';
+export declare function createCompilerPlugin(pluginOptions: CompilerPluginOptions, styleOptions: BundleStylesheetOptions & {
+    inlineStyleLanguage: string;
+}): import('esbuild').Plugin;
 export * from './utils/bundle-calculator';
 export { checkPort } from './utils/check-port';
 export { deleteOutputDir } from './utils/delete-output-dir';

package/src/private.js

@@ -21,13 +21,16 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.assertCompatibleAngularVersion = exports.getSupportedBrowsers = exports.generateBuildStatsTable = exports.augmentAppWithServiceWorker = exports.purgeStaleBuildCache = exports.createTranslationLoader = exports.loadProxyConfiguration = exports.InlineCriticalCssProcessor = exports.IndexHtmlGenerator = exports.loadTranslations = exports.createI18nOptions = exports.deleteOutputDir = exports.checkPort = exports.createCompilerPlugin = exports.JavaScriptTransformer = exports.createJitResourceTransformer = exports.SourceFileCache = exports.SassWorkerImplementation = exports.transformSupportedBrowsersToTargets = exports.emitFilesToDisk = exports.serveWithVite = exports.ResultKind = exports.buildApplicationInternal = void 0;
+exports.assertCompatibleAngularVersion = exports.getSupportedBrowsers = exports.generateBuildStatsTable = exports.augmentAppWithServiceWorker = exports.purgeStaleBuildCache = exports.createTranslationLoader = exports.loadProxyConfiguration = exports.InlineCriticalCssProcessor = exports.IndexHtmlGenerator = exports.loadTranslations = exports.createI18nOptions = exports.deleteOutputDir = exports.checkPort = exports.JavaScriptTransformer = exports.createJitResourceTransformer = exports.SourceFileCache = exports.SassWorkerImplementation = exports.transformSupportedBrowsersToTargets = exports.emitFilesToDisk = exports.serveWithVite = exports.ResultKind = exports.buildApplicationInternal = void 0;
+exports.createCompilerPlugin = createCompilerPlugin;
 /**
  * @fileoverview
  * Private exports intended only for use with the @angular-devkit/build-angular package.
  * All exports are not supported for external use, do not provide SemVer guarantees, and
  * their existence may change in any future version.
  */
+const compiler_plugin_1 = require("./tools/esbuild/angular/compiler-plugin");
+const component_stylesheets_1 = require("./tools/esbuild/angular/component-stylesheets");
 // Builders
 var application_1 = require("./builders/application");
 Object.defineProperty(exports, "buildApplicationInternal", { enumerable: true, get: function () { return application_1.buildApplicationInternal; } });
@@ -49,8 +52,9 @@ var jit_resource_transformer_1 = require("./tools/angular/transformers/jit-resou
 Object.defineProperty(exports, "createJitResourceTransformer", { enumerable: true, get: function () { return jit_resource_transformer_1.createJitResourceTransformer; } });
 var javascript_transformer_1 = require("./tools/esbuild/javascript-transformer");
 Object.defineProperty(exports, "JavaScriptTransformer", { enumerable: true, get: function () { return javascript_transformer_1.JavaScriptTransformer; } });
-var compiler_plugin_1 = require("./tools/esbuild/angular/compiler-plugin");
-Object.defineProperty(exports, "createCompilerPlugin", { enumerable: true, get: function () { return compiler_plugin_1.createCompilerPlugin; } });
+function createCompilerPlugin(pluginOptions, styleOptions) {
+    return (0, compiler_plugin_1.createCompilerPlugin)(pluginOptions, new component_stylesheets_1.ComponentStylesheetBundler(styleOptions, styleOptions.inlineStyleLanguage, pluginOptions.incremental));
+}
 // Utilities
 __exportStar(require("./utils/bundle-calculator"), exports);
 var check_port_1 = require("./utils/check-port");

package/src/tools/angular/compilation/aot-compilation.js

@@ -51,6 +51,17 @@ class AotCompilation extends angular_compilation_1.AngularCompilation {
         if (compilerOptions.externalRuntimeStyles) {
             hostOptions.externalStylesheets ??= new Map();
         }
+        // Collect stale source files for HMR analysis of inline component resources
+        let staleSourceFiles;
+        if (compilerOptions['_enableHmr'] && hostOptions.modifiedFiles && this.#state) {
+            for (const modifiedFile of hostOptions.modifiedFiles) {
+                const sourceFile = this.#state.typeScriptProgram.getSourceFile(modifiedFile);
+                if (sourceFile) {
+                    staleSourceFiles ??= new Map();
+                    staleSourceFiles.set(modifiedFile, sourceFile);
+                }
+            }
+        }
         // Create Angular compiler host
         const host = (0, angular_host_1.createAngularCompilerHost)(typescript_1.default, compilerOptions, hostOptions);
         // Create the Angular specific program that contains the Angular compiler
@@ -67,12 +78,8 @@ class AotCompilation extends angular_compilation_1.AngularCompilation {
         const typeScriptProgram = typescript_1.default.createEmitAndSemanticDiagnosticsBuilderProgram(angularTypeScriptProgram, host, oldProgram, configurationDiagnostics);
         await (0, profiling_1.profileAsync)('NG_ANALYZE_PROGRAM', () => angularCompiler.analyzeAsync());
         let templateUpdates;
-        if (compilerOptions['_enableHmr'] &&
-            hostOptions.modifiedFiles &&
-            hasOnlyTemplates(hostOptions.modifiedFiles)) {
-            const componentNodes = [...hostOptions.modifiedFiles].flatMap((file) => [
-                ...angularCompiler.getComponentsWithTemplateFile(file),
-            ]);
+        if (compilerOptions['_enableHmr'] && hostOptions.modifiedFiles && this.#state) {
+            const componentNodes = collectHmrCandidates(hostOptions.modifiedFiles, angularProgram, staleSourceFiles);
             for (const node of componentNodes) {
                 if (!typescript_1.default.isClassDeclaration(node)) {
                     continue;
@@ -296,13 +303,35 @@ function findAffectedFiles(builder, { ignoreForDiagnostics }, includeTTC) {
     }
     return affectedFiles;
 }
-function hasOnlyTemplates(modifiedFiles) {
+function collectHmrCandidates(modifiedFiles, { compiler }, staleSourceFiles) {
+    const candidates = new Set();
     for (const file of modifiedFiles) {
-        const lowerFile = file.toLowerCase();
-        if (lowerFile.endsWith('.html') || lowerFile.endsWith('.svg')) {
+        const templateFileNodes = compiler.getComponentsWithTemplateFile(file);
+        if (templateFileNodes.size) {
+            templateFileNodes.forEach((node) => candidates.add(node));
+            continue;
+        }
+        const styleFileNodes = compiler.getComponentsWithStyleFile(file);
+        if (styleFileNodes.size) {
+            styleFileNodes.forEach((node) => candidates.add(node));
             continue;
         }
-        return false;
+        const staleSource = staleSourceFiles?.get(file);
+        if (staleSource === undefined) {
+            // Unknown file requires a rebuild so clear out the candidates and stop collecting
+            candidates.clear();
+            break;
+        }
+        const updatedSource = compiler.getCurrentProgram().getSourceFile(file);
+        if (updatedSource === undefined) {
+            // No longer existing program file requires a rebuild so clear out the candidates and stop collecting
+            candidates.clear();
+            break;
+        }
+        // Compare the stale and updated file for changes
+        // TODO: Implement -- for now assume a rebuild is needed
+        candidates.clear();
+        break;
     }
-    return true;
+    return candidates;
 }

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

@@ -157,7 +157,7 @@ function createCompilerPlugin(pluginOptions, stylesheetBundler) {
                             // invalid the output and force a full page reload for HMR cases. The containing file and order
                             // of the style within the containing file is used.
                             pluginOptions.externalRuntimeStyles
-                                ? (0, node_crypto_1.createHash)('sha-256')
+                                ? (0, node_crypto_1.createHash)('sha256')
                                     .update(containingFile)
                                     .update((order ?? 0).toString())
                                     .update(className ?? '')

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

@@ -171,7 +171,6 @@ function createServerMainCodeBundleOptions(options, target, sourceFileCache, sty
     return (loadResultCache) => {
         const pluginOptions = (0, compiler_plugin_options_1.createCompilerPluginOptions)(options, sourceFileCache, loadResultCache);
         const mainServerNamespace = 'angular:main-server';
-        const mainServerInjectPolyfillsNamespace = 'angular:main-server-inject-polyfills';
         const mainServerInjectManifestNamespace = 'angular:main-server-inject-manifest';
         const zoneless = (0, utils_1.isZonelessApp)(polyfills);
         const entryPoints = {
@@ -187,7 +186,9 @@ function createServerMainCodeBundleOptions(options, target, sourceFileCache, sty
         const buildOptions = {
             ...getEsBuildServerCommonOptions(options),
             target,
-            inject: [mainServerInjectPolyfillsNamespace, mainServerInjectManifestNamespace],
+            banner: {
+                js: `import './polyfills.server.mjs';`,
+            },
             entryPoints,
             supported: (0, utils_1.getFeatureSupport)(target, zoneless),
             plugins: [
@@ -217,16 +218,9 @@ function createServerMainCodeBundleOptions(options, target, sourceFileCache, sty
             buildOptions.external.push('xhr2');
         }
         buildOptions.plugins.push((0, server_bundle_metadata_plugin_1.createServerBundleMetadata)(), (0, virtual_module_plugin_1.createVirtualModulePlugin)({
-            namespace: mainServerInjectPolyfillsNamespace,
-            cache: loadResultCache,
-            loadContent: () => ({
-                contents: `import './polyfills.server.mjs';`,
-                loader: 'js',
-                resolveDir: workspaceRoot,
-            }),
-        }), (0, virtual_module_plugin_1.createVirtualModulePlugin)({
             namespace: mainServerInjectManifestNamespace,
             cache: loadResultCache,
+            entryPointOnly: false,
             loadContent: async () => {
                 const contents = [
                     // Configure `@angular/ssr` manifest.
@@ -246,15 +240,17 @@ function createServerMainCodeBundleOptions(options, target, sourceFileCache, sty
             loadContent: async () => {
                 const mainServerEntryPointJsImport = entryFileToWorkspaceRelative(workspaceRoot, mainServerEntryPoint);
                 const contents = [
+                    // Inject manifest
+                    `import '${mainServerInjectManifestNamespace}';`,
+                    // Add @angular/ssr exports
+                    `export {
+              ɵdestroyAngularServerApp,
+              ɵextractRoutesAndCreateRouteTree,
+              ɵgetOrCreateAngularServerApp,
+            } from '@angular/ssr';`,
                     // Re-export all symbols including default export from 'main.server.ts'
                     `export { default } from '${mainServerEntryPointJsImport}';`,
                     `export * from '${mainServerEntryPointJsImport}';`,
-                    // Add @angular/ssr exports
-                    `export {
-            ɵdestroyAngularServerApp,
-            ɵextractRoutesAndCreateRouteTree,
-            ɵgetOrCreateAngularServerApp,
-          } from '@angular/ssr';`,
                 ];
                 return {
                     contents: contents.join('\n'),
@@ -277,17 +273,21 @@ function createSsrEntryCodeBundleOptions(options, target, sourceFileCache, style
         const pluginOptions = (0, compiler_plugin_options_1.createCompilerPluginOptions)(options, sourceFileCache, loadResultCache);
         const ssrEntryNamespace = 'angular:ssr-entry';
         const ssrInjectManifestNamespace = 'angular:ssr-entry-inject-manifest';
-        const ssrInjectRequireNamespace = 'angular:ssr-entry-inject-require';
         const isNodePlatform = options.ssrOptions?.platform !== schema_1.ExperimentalPlatform.Neutral;
-        const inject = [ssrInjectManifestNamespace];
-        if (isNodePlatform) {
-            inject.unshift(ssrInjectRequireNamespace);
-        }
         const buildOptions = {
             ...getEsBuildServerCommonOptions(options),
             target,
+            banner: isNodePlatform
+                ? {
+                    js: [
+                        // Note: Needed as esbuild does not provide require shims / proxy from ESModules.
+                        // See: https://github.com/evanw/esbuild/issues/1921.
+                        `import { createRequire } from 'node:module';`,
+                        `globalThis['require'] ??= createRequire(import.meta.url);`,
+                    ].join('\n'),
+                }
+                : undefined,
             entryPoints: {
-                // TODO: consider renaming to index
                 'server': ssrEntryNamespace,
             },
             supported: (0, utils_1.getFeatureSupport)(target, true),
@@ -299,7 +299,6 @@ function createSsrEntryCodeBundleOptions(options, target, sourceFileCache, style
                 // Component stylesheet bundler
                 stylesheetBundler),
             ],
-            inject,
         };
         buildOptions.plugins ??= [];
         if (externalPackages) {
@@ -317,24 +316,9 @@ function createSsrEntryCodeBundleOptions(options, target, sourceFileCache, style
             buildOptions.external.push('xhr2');
         }
         buildOptions.plugins.push((0, server_bundle_metadata_plugin_1.createServerBundleMetadata)({ ssrEntryBundle: true }), (0, virtual_module_plugin_1.createVirtualModulePlugin)({
-            namespace: ssrInjectRequireNamespace,
-            cache: loadResultCache,
-            loadContent: () => {
-                const contents = [
-                    // Note: Needed as esbuild does not provide require shims / proxy from ESModules.
-                    // See: https://github.com/evanw/esbuild/issues/1921.
-                    `import { createRequire } from 'node:module';`,
-                    `globalThis['require'] ??= createRequire(import.meta.url);`,
-                ];
-                return {
-                    contents: contents.join('\n'),
-                    loader: 'js',
-                    resolveDir: workspaceRoot,
-                };
-            },
-        }), (0, virtual_module_plugin_1.createVirtualModulePlugin)({
             namespace: ssrInjectManifestNamespace,
             cache: loadResultCache,
+            entryPointOnly: false,
             loadContent: () => {
                 const contents = [
                     // Configure `@angular/ssr` app engine manifest.
@@ -354,6 +338,8 @@ function createSsrEntryCodeBundleOptions(options, target, sourceFileCache, style
             loadContent: () => {
                 const serverEntryPointJsImport = entryFileToWorkspaceRelative(workspaceRoot, serverEntryPoint);
                 const contents = [
+                    // Configure `@angular/ssr` app engine manifest.
+                    `import '${ssrInjectManifestNamespace}';`,
                     // Re-export all symbols including default export
                     `import * as server from '${serverEntryPointJsImport}';`,
                     `export * from '${serverEntryPointJsImport}';`,

package/src/tools/esbuild/wasm-plugin.js

@@ -185,7 +185,7 @@ function generateInitHelper(streaming, wasmContents) {
     let resultContents;
     if (streaming) {
         const fetchOptions = {
-            integrity: 'sha256-' + (0, node_crypto_1.createHash)('sha-256').update(wasmContents).digest('base64'),
+            integrity: 'sha256-' + (0, node_crypto_1.createHash)('sha256').update(wasmContents).digest('base64'),
         };
         const fetchContents = `fetch(new URL(wasmPath, import.meta.url), ${JSON.stringify(fetchOptions)})`;
         resultContents = `await WebAssembly.instantiateStreaming(${fetchContents}, imports)`;

package/src/utils/normalize-cache.js

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

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

@@ -101,10 +101,8 @@ function generateAngularServerAppManifest(additionalHtmlOutputFiles, outputFiles
         const extension = (0, node_path_1.extname)(file.path);
         if (extension === '.html' || (inlineCriticalCss && extension === '.css')) {
             const jsChunkFilePath = `assets-chunks/${file.path.replace(/[./]/g, '_')}.mjs`;
-            const escapedContent = escapeUnsafeChars(file.text);
-            serverAssetsChunks.push((0, utils_1.createOutputFile)(jsChunkFilePath, `export default \`${escapedContent}\`;`, bundler_context_1.BuildOutputFileType.ServerApplication));
-            const contentLength = Buffer.byteLength(escapedContent);
-            serverAssetsContent.push(`['${file.path}', {size: ${contentLength}, hash: '${file.hash}', text: () => import('./${jsChunkFilePath}').then(m => m.default)}]`);
+            serverAssetsChunks.push((0, utils_1.createOutputFile)(jsChunkFilePath, `export default \`${escapeUnsafeChars(file.text)}\`;`, bundler_context_1.BuildOutputFileType.ServerApplication));
+            serverAssetsContent.push(`['${file.path}', {size: ${file.size}, hash: '${file.hash}', text: () => import('./${jsChunkFilePath}').then(m => m.default)}]`);
         }
     }
     const manifestContent = `

package/src/utils/server-rendering/routes-extractor-worker.d.ts

@@ -13,5 +13,4 @@ export interface ExtractRoutesWorkerData extends ESMInMemoryFileLoaderWorkerData
 }
 /** Renders an application based on a provided options. */
 declare function extractRoutes(): Promise<RoutersExtractorWorkerResult>;
-declare const _default: Promise<typeof extractRoutes>;
-export default _default;
+export default extractRoutes;

package/src/utils/server-rendering/routes-extractor-worker.js

@@ -16,22 +16,16 @@ const load_esm_from_memory_1 = require("./load-esm-from-memory");
  * This is passed as workerData when setting up the worker via the `piscina` package.
  */
 const { outputMode, hasSsrEntry } = worker_threads_1.workerData;
-let serverURL = launch_server_1.DEFAULT_URL;
 /** Renders an application based on a provided options. */
 async function extractRoutes() {
+    const serverURL = outputMode !== undefined && hasSsrEntry ? await (0, launch_server_1.launchServer)() : launch_server_1.DEFAULT_URL;
+    (0, fetch_patch_1.patchFetchToLoadInMemoryAssets)(serverURL);
     const { ɵextractRoutesAndCreateRouteTree: extractRoutesAndCreateRouteTree } = await (0, load_esm_from_memory_1.loadEsmModuleFromMemory)('./main.server.mjs');
-    const { routeTree, appShellRoute, errors } = await extractRoutesAndCreateRouteTree(serverURL, undefined /** manifest */, true /** invokeGetPrerenderParams */, outputMode === schema_1.OutputMode.Server /** includePrerenderFallbackRoutes */);
+    const { routeTree, appShellRoute, errors } = await extractRoutesAndCreateRouteTree(serverURL, undefined /** manifest */, outputMode !== undefined /** invokeGetPrerenderParams */, outputMode === schema_1.OutputMode.Server /** includePrerenderFallbackRoutes */);
     return {
         errors,
         appShellRoute,
         serializedRouteTree: routeTree.toObject(),
     };
 }
-async function initialize() {
-    if (outputMode !== undefined && hasSsrEntry) {
-        serverURL = await (0, launch_server_1.launchServer)();
-    }
-    (0, fetch_patch_1.patchFetchToLoadInMemoryAssets)(serverURL);
-    return extractRoutes;
-}
-exports.default = initialize();
+exports.default = extractRoutes;