@angular/build 19.0.0-rc.0 → 19.0.0-rc.1

package/src/tools/esbuild/compiler-plugin-options.d.ts

@@ -8,6 +8,7 @@
 import { NormalizedApplicationBuildOptions } from '../../builders/application/options';
 import type { createCompilerPlugin } from './angular/compiler-plugin';
 import type { SourceFileCache } from './angular/source-file-cache';
+import type { LoadResultCache } from './load-result-cache';
 type CreateCompilerPluginParameters = Parameters<typeof createCompilerPlugin>;
-export declare function createCompilerPluginOptions(options: NormalizedApplicationBuildOptions, sourceFileCache?: SourceFileCache): CreateCompilerPluginParameters[0];
+export declare function createCompilerPluginOptions(options: NormalizedApplicationBuildOptions, sourceFileCache: SourceFileCache, loadResultCache?: LoadResultCache, templateUpdates?: Map<string, string>): CreateCompilerPluginParameters[0];
 export {};

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

@@ -8,7 +8,7 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createCompilerPluginOptions = createCompilerPluginOptions;
-function createCompilerPluginOptions(options, sourceFileCache) {
+function createCompilerPluginOptions(options, sourceFileCache, loadResultCache, templateUpdates) {
     const { sourcemapOptions, tsconfig, fileReplacements, advancedOptimizations, jit, externalRuntimeStyles, instrumentForCoverage, } = options;
     const incremental = !!options.watch;
     return {
@@ -19,9 +19,10 @@ function createCompilerPluginOptions(options, sourceFileCache) {
         advancedOptimizations,
         fileReplacements,
         sourceFileCache,
-        loadResultCache: sourceFileCache?.loadResultCache,
+        loadResultCache,
         incremental,
         externalRuntimeStyles,
         instrumentForCoverage,
+        templateUpdates,
     };
 }

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

@@ -10,6 +10,7 @@ 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 utils_1 = require("../../utils/server-rendering/esm-in-memory-loader/utils");
 const worker_pool_1 = require("../../utils/worker-pool");
 /**
  * A class that performs transformation of JavaScript files and raw data.
@@ -42,7 +43,7 @@ class JavaScriptTransformer {
             filename: require.resolve('./javascript-transformer-worker'),
             maxThreads: this.maxThreads,
             // Prevent passing `--import` (loader-hooks) from parent to child worker.
-            execArgv: [],
+            execArgv: process.execArgv.filter((v) => v !== utils_1.IMPORT_EXEC_ARGV),
         });
         return this.#workerPool;
     }

package/src/tools/esbuild/server-bundle-metadata-plugin.d.ts

@@ -13,7 +13,7 @@ import type { Plugin } from 'esbuild';
  * @param options Optional configuration object.
  * - `ssrEntryBundle`: If `true`, marks the bundle as an SSR entry point.
  *
- * @note We can't rely on `platform: node` or `platform: neutral`, as the latter
+ * @remarks We can't rely on `platform: node` or `platform: neutral`, as the latter
  *       is used for non-SSR-related code too (e.g., global scripts).
  * @returns An esbuild plugin that injects SSR metadata into the build result's metafile.
  */

package/src/tools/esbuild/server-bundle-metadata-plugin.js

@@ -15,7 +15,7 @@ exports.createServerBundleMetadata = createServerBundleMetadata;
  * @param options Optional configuration object.
  * - `ssrEntryBundle`: If `true`, marks the bundle as an SSR entry point.
  *
- * @note We can't rely on `platform: node` or `platform: neutral`, as the latter
+ * @remarks We can't rely on `platform: node` or `platform: neutral`, as the latter
  *       is used for non-SSR-related code too (e.g., global scripts).
  * @returns An esbuild plugin that injects SSR metadata into the build result's metafile.
  */

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

@@ -7,4 +7,9 @@
  */
 import type { Connect, ViteDevServer } from 'vite';
 import { AngularMemoryOutputFiles } from '../utils';
-export declare function createAngularAssetsMiddleware(server: ViteDevServer, assets: Map<string, string>, outputFiles: AngularMemoryOutputFiles, usedComponentStyles: Map<string, Set<string>>): Connect.NextHandleFunction;
+export interface ComponentStyleRecord {
+    rawContent: Uint8Array;
+    used?: Set<string>;
+    reload?: boolean;
+}
+export declare function createAngularAssetsMiddleware(server: ViteDevServer, assets: Map<string, string>, outputFiles: AngularMemoryOutputFiles, componentStyles: Map<string, ComponentStyleRecord>, encapsulateStyle: (style: Uint8Array, componentId: string) => string): Connect.NextHandleFunction;

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

@@ -10,9 +10,8 @@ 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, usedComponentStyles) {
+function createAngularAssetsMiddleware(server, assets, outputFiles, componentStyles, encapsulateStyle) {
     return function angularAssetsMiddleware(req, res, next) {
         if (req.url === undefined || res.writableEnded) {
             return;
@@ -59,18 +58,25 @@ function createAngularAssetsMiddleware(server, assets, outputFiles, usedComponen
         if (extension !== '.js' && extension !== '.html') {
             const outputFile = outputFiles.get(pathname);
             if (outputFile?.servable) {
-                const data = outputFile.contents;
-                if (extension === '.css') {
+                let data = outputFile.contents;
+                const componentStyle = componentStyles.get(pathname);
+                if (componentStyle) {
                     // Inject component ID for view encapsulation if requested
-                    const componentId = new URL(req.url, 'http://localhost').searchParams.get('ngcomp');
+                    const searchParams = new URL(req.url, 'http://localhost').searchParams;
+                    const componentId = searchParams.get('ngcomp');
                     if (componentId !== null) {
+                        // Track if the component uses ShadowDOM encapsulation (3 = ViewEncapsulation.ShadowDom)
+                        // Shadow DOM components currently require a full reload.
+                        // Vite's CSS hot replacement does not support shadow root searching.
+                        if (searchParams.get('e') === '3') {
+                            componentStyle.reload = true;
+                        }
                         // Record the component style usage for HMR updates
-                        const usedIds = usedComponentStyles.get(pathname);
-                        if (usedIds === undefined) {
-                            usedComponentStyles.set(pathname, new Set([componentId]));
+                        if (componentStyle.used === undefined) {
+                            componentStyle.used = new Set([componentId]);
                         }
                         else {
-                            usedIds.add(componentId);
+                            componentStyle.used.add(componentId);
                         }
                         // Report if there are no changes to avoid reprocessing
                         const etag = `W/"${outputFile.contents.byteLength}-${outputFile.hash}-${componentId}"`;
@@ -82,23 +88,21 @@ function createAngularAssetsMiddleware(server, assets, outputFiles, usedComponen
                         // Shim the stylesheet if a component ID is provided
                         if (componentId.length > 0) {
                             // Validate component ID
-                            if (/^[_.\-\p{Letter}\d]+-c\d+$/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.setHeader('ETag', etag);
-                                    res.end(encapsulatedData);
-                                })
-                                    .catch((e) => next(e));
-                                return;
-                            }
-                            else {
+                            if (!/^[_.\-\p{Letter}\d]+-c\d+$/u.test(componentId)) {
+                                const message = 'Invalid component stylesheet ID request: ' + componentId;
                                 // eslint-disable-next-line no-console
-                                console.error('Invalid component stylesheet ID request: ' + componentId);
+                                console.error(message);
+                                res.statusCode = 400;
+                                res.end(message);
+                                return;
                             }
+                            data = encapsulateStyle(data, componentId);
                         }
+                        res.setHeader('Content-Type', 'text/css');
+                        res.setHeader('Cache-Control', 'no-cache');
+                        res.setHeader('ETag', etag);
+                        res.end(data);
+                        return;
                     }
                 }
                 // Avoid resending the content if it has not changed since last request

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

@@ -25,7 +25,7 @@ function createAngularComponentMiddleware(templateUpdates) {
             res.end();
             return;
         }
-        const updateCode = templateUpdates.get(componentId) ?? '';
+        const updateCode = templateUpdates.get(encodeURIComponent(componentId)) ?? '';
         res.setHeader('Content-Type', 'text/javascript');
         res.setHeader('Cache-Control', 'no-cache');
         res.end(updateCode);

package/src/tools/vite/middlewares/index.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.dev/license
  */
-export { createAngularAssetsMiddleware } from './assets-middleware';
+export { type ComponentStyleRecord, createAngularAssetsMiddleware } from './assets-middleware';
 export { angularHtmlFallbackMiddleware } from './html-fallback-middleware';
 export { createAngularIndexHtmlMiddleware } from './index-html-middleware';
 export { createAngularSsrExternalMiddleware, createAngularSsrInternalMiddleware, } from './ssr-middleware';

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

@@ -23,7 +23,9 @@ function createAngularSsrInternalMiddleware(server, indexHtmlTransformer) {
             await (0, load_esm_1.loadEsmModule)('@angular/compiler');
             const { writeResponseToNodeResponse, createWebRequestFromNodeRequest } = await (0, load_esm_1.loadEsmModule)('@angular/ssr/node');
             const { ɵgetOrCreateAngularServerApp } = (await server.ssrLoadModule('/main.server.mjs'));
-            const angularServerApp = ɵgetOrCreateAngularServerApp();
+            const angularServerApp = ɵgetOrCreateAngularServerApp({
+                allowStaticRouteRender: true,
+            });
             // Only Add the transform hook only if it's a different instance.
             if (cachedAngularServerApp !== angularServerApp) {
                 angularServerApp.hooks.on('html:transform:pre', async ({ html, url }) => {
@@ -35,7 +37,7 @@ function createAngularSsrInternalMiddleware(server, indexHtmlTransformer) {
             const webReq = new Request(createWebRequestFromNodeRequest(req), {
                 signal: AbortSignal.timeout(30_000),
             });
-            const webRes = await angularServerApp.render(webReq);
+            const webRes = await angularServerApp.handle(webReq);
             if (!webRes) {
                 return next();
             }
@@ -66,6 +68,7 @@ async function createAngularSsrExternalMiddleware(server, indexHtmlTransformer)
                 return;
             }
             if (cachedAngularAppEngine !== AngularAppEngine) {
+                AngularAppEngine.ɵallowStaticRouteRender = true;
                 AngularAppEngine.ɵhooks.on('html:transform:pre', async ({ html, url }) => {
                     const processedHtml = await server.transformIndexHtml(url.pathname, html);
                     return indexHtmlTransformer?.(processedHtml) ?? processedHtml;

package/src/tools/vite/plugins/angular-memory-plugin.d.ts

@@ -11,6 +11,7 @@ interface AngularMemoryPluginOptions {
     virtualProjectRoot: string;
     outputFiles: AngularMemoryOutputFiles;
     external?: string[];
+    skipViteClient?: boolean;
 }
 export declare function createAngularMemoryPlugin(options: AngularMemoryPluginOptions): Promise<Plugin>;
 export {};

package/src/tools/vite/plugins/angular-memory-plugin.js

@@ -18,8 +18,6 @@ const load_esm_1 = require("../../../utils/load-esm");
 async function createAngularMemoryPlugin(options) {
     const { virtualProjectRoot, outputFiles, external } = options;
     const { normalizePath } = await (0, load_esm_1.loadEsmModule)('vite');
-    // See: https://github.com/vitejs/vite/blob/a34a73a3ad8feeacc98632c0f4c643b6820bbfda/packages/vite/src/node/server/pluginContainer.ts#L331-L334
-    const defaultImporter = (0, node_path_1.join)(virtualProjectRoot, 'index.html');
     return {
         name: 'vite:angular-memory',
         // Ensures plugin hooks run before built-in Vite hooks
@@ -32,17 +30,10 @@ async function createAngularMemoryPlugin(options) {
                 return source;
             }
             if (importer) {
-                let normalizedSource;
                 if (source[0] === '.' && normalizePath(importer).startsWith(virtualProjectRoot)) {
                     // Remove query if present
                     const [importerFile] = importer.split('?', 1);
-                    normalizedSource = (0, node_path_1.join)((0, node_path_1.dirname)((0, node_path_1.relative)(virtualProjectRoot, importerFile)), source);
-                }
-                else if (source[0] === '/' && importer === defaultImporter) {
-                    normalizedSource = (0, node_path_1.basename)(source);
-                }
-                if (normalizedSource) {
-                    source = '/' + normalizePath(normalizedSource);
+                    source = '/' + (0, node_path_1.join)((0, node_path_1.dirname)((0, node_path_1.relative)(virtualProjectRoot, importerFile)), source);
                 }
             }
             const [file] = source.split('?', 1);
@@ -55,9 +46,10 @@ async function createAngularMemoryPlugin(options) {
             const relativeFile = '/' + normalizePath((0, node_path_1.relative)(virtualProjectRoot, file));
             const codeContents = outputFiles.get(relativeFile)?.contents;
             if (codeContents === undefined) {
-                return relativeFile.endsWith('/node_modules/vite/dist/client/client.mjs')
-                    ? loadViteClientCode(file)
-                    : undefined;
+                if (relativeFile.endsWith('/node_modules/vite/dist/client/client.mjs')) {
+                    return options.skipViteClient ? '' : loadViteClientCode(file);
+                }
+                return undefined;
             }
             const code = Buffer.from(codeContents).toString('utf-8');
             const mapContents = outputFiles.get(relativeFile + '.map')?.contents;

package/src/tools/vite/plugins/setup-middlewares-plugin.d.ts

@@ -6,6 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 import type { Connect, Plugin } from 'vite';
+import { ComponentStyleRecord } from '../middlewares';
 import { AngularMemoryOutputFiles } from '../utils';
 export declare enum ServerSsrMode {
     /**
@@ -34,7 +35,7 @@ interface AngularSetupMiddlewaresPluginOptions {
     assets: Map<string, string>;
     extensionMiddleware?: Connect.NextHandleFunction[];
     indexHtmlTransformer?: (content: string) => Promise<string>;
-    usedComponentStyles: Map<string, Set<string>>;
+    componentStyles: Map<string, ComponentStyleRecord>;
     templateUpdates: Map<string, string>;
     ssrMode: ServerSsrMode;
 }

package/src/tools/vite/plugins/setup-middlewares-plugin.js

@@ -9,6 +9,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ServerSsrMode = void 0;
 exports.createAngularSetupMiddlewaresPlugin = createAngularSetupMiddlewaresPlugin;
+const load_esm_1 = require("../../../utils/load-esm");
 const middlewares_1 = require("../middlewares");
 var ServerSsrMode;
 (function (ServerSsrMode) {
@@ -33,16 +34,23 @@ var ServerSsrMode;
      */
     ServerSsrMode[ServerSsrMode["ExternalSsrMiddleware"] = 2] = "ExternalSsrMiddleware";
 })(ServerSsrMode || (exports.ServerSsrMode = ServerSsrMode = {}));
+async function createEncapsulateStyle() {
+    const { encapsulateStyle } = await (0, load_esm_1.loadEsmModule)('@angular/compiler');
+    const decoder = new TextDecoder('utf-8');
+    return (style, componentId) => {
+        return encapsulateStyle(decoder.decode(style), componentId);
+    };
+}
 function createAngularSetupMiddlewaresPlugin(options) {
     return {
         name: 'vite:angular-setup-middlewares',
         enforce: 'pre',
-        configureServer(server) {
-            const { indexHtmlTransformer, outputFiles, extensionMiddleware, assets, usedComponentStyles, templateUpdates, ssrMode, } = options;
+        async configureServer(server) {
+            const { indexHtmlTransformer, outputFiles, extensionMiddleware, assets, componentStyles, templateUpdates, ssrMode, } = options;
             // Headers, assets and resources get handled first
             server.middlewares.use((0, middlewares_1.createAngularHeadersMiddleware)(server));
             server.middlewares.use((0, middlewares_1.createAngularComponentMiddleware)(templateUpdates));
-            server.middlewares.use((0, middlewares_1.createAngularAssetsMiddleware)(server, assets, outputFiles, usedComponentStyles));
+            server.middlewares.use((0, middlewares_1.createAngularAssetsMiddleware)(server, assets, outputFiles, componentStyles, await createEncapsulateStyle()));
             extensionMiddleware?.forEach((middleware) => server.middlewares.use(middleware));
             // Returning a function, installs middleware after the main transform middleware but
             // before the built-in HTML middleware

package/src/utils/environment-options.d.ts

@@ -16,4 +16,5 @@ export declare const useTypeChecking: boolean;
 export declare const useJSONBuildLogs: boolean;
 export declare const shouldOptimizeChunks: boolean;
 export declare const useComponentStyleHmr: boolean;
+export declare const useComponentTemplateHmr: boolean;
 export declare const usePartialSsrBuild: boolean;

package/src/utils/environment-options.js

@@ -7,7 +7,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.usePartialSsrBuild = exports.useComponentStyleHmr = exports.shouldOptimizeChunks = exports.useJSONBuildLogs = exports.useTypeChecking = exports.shouldWatchRoot = exports.debugPerformance = exports.useParallelTs = exports.maxWorkers = exports.allowMinify = exports.shouldBeautify = exports.allowMangle = void 0;
+exports.usePartialSsrBuild = exports.useComponentTemplateHmr = exports.useComponentStyleHmr = exports.shouldOptimizeChunks = exports.useJSONBuildLogs = exports.useTypeChecking = exports.shouldWatchRoot = exports.debugPerformance = exports.useParallelTs = exports.maxWorkers = exports.allowMinify = exports.shouldBeautify = exports.allowMangle = void 0;
 const node_os_1 = require("node:os");
 function isDisabled(variable) {
     return variable === '0' || variable.toLowerCase() === 'false';
@@ -84,5 +84,7 @@ const optimizeChunksVariable = process.env['NG_BUILD_OPTIMIZE_CHUNKS'];
 exports.shouldOptimizeChunks = isPresent(optimizeChunksVariable) && isEnabled(optimizeChunksVariable);
 const hmrComponentStylesVariable = process.env['NG_HMR_CSTYLES'];
 exports.useComponentStyleHmr = !isPresent(hmrComponentStylesVariable) || !isDisabled(hmrComponentStylesVariable);
+const hmrComponentTemplateVariable = process.env['NG_HMR_TEMPLATES'];
+exports.useComponentTemplateHmr = isPresent(hmrComponentTemplateVariable) && isEnabled(hmrComponentTemplateVariable);
 const partialSsrBuildVariable = process.env['NG_BUILD_PARTIAL_SSR'];
 exports.usePartialSsrBuild = isPresent(partialSsrBuildVariable) && isEnabled(partialSsrBuildVariable);

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-rc.0';
+const VERSION = '19.0.0-rc.1';
 function hasCacheMetadata(value) {
     return (!!value &&
         typeof value === 'object' &&

package/src/utils/server-rendering/esm-in-memory-loader/utils.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @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.dev/license
+ */
+export declare const IMPORT_EXEC_ARGV: string;

package/src/utils/server-rendering/esm-in-memory-loader/utils.js

@@ -0,0 +1,13 @@
+"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.dev/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IMPORT_EXEC_ARGV = void 0;
+const node_path_1 = require("node:path");
+const node_url_1 = require("node:url");
+exports.IMPORT_EXEC_ARGV = '--import=' + (0, node_url_1.pathToFileURL)((0, node_path_1.join)(__dirname, 'register-hooks.js')).href;

package/src/utils/server-rendering/manifest.d.ts

@@ -6,8 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 import { NormalizedApplicationBuildOptions } from '../../builders/application/options';
-import type { BuildOutputFile } from '../../tools/esbuild/bundler-context';
-import type { PrerenderedRoutesRecord } from '../../tools/esbuild/bundler-execution-result';
+import { type BuildOutputFile } from '../../tools/esbuild/bundler-context';
 export declare const SERVER_APP_MANIFEST_FILENAME = "angular-app-manifest.mjs";
 export declare const SERVER_APP_ENGINE_MANIFEST_FILENAME = "angular-app-engine-manifest.mjs";
 /**
@@ -21,10 +20,8 @@ export declare const SERVER_APP_ENGINE_MANIFEST_FILENAME = "angular-app-engine-m
  * includes settings for inlining locales and determining the output structure.
  * @param baseHref - The base HREF for the application. This is used to set the base URL
  * for all relative URLs in the application.
- * @param perenderedRoutes - A record mapping static paths to their associated data.
- * @returns A string representing the content of the SSR server manifest for App Engine.
  */
-export declare function generateAngularServerAppEngineManifest(i18nOptions: NormalizedApplicationBuildOptions['i18nOptions'], baseHref: string | undefined, perenderedRoutes?: PrerenderedRoutesRecord | undefined): string;
+export declare function generateAngularServerAppEngineManifest(i18nOptions: NormalizedApplicationBuildOptions['i18nOptions'], baseHref: string | undefined): string;
 /**
  * Generates the server manifest for the standard Node.js environment.
  *
@@ -44,7 +41,11 @@ export declare function generateAngularServerAppEngineManifest(i18nOptions: Norm
  * @param locale - An optional string representing the locale or language code to be used for
  * the application, helping with localization and rendering content specific to the locale.
  *
- * @returns A string representing the content of the SSR server manifest for the Node.js
- * environment.
+ * @returns An object containing:
+ * - `manifestContent`: A string of the SSR manifest content.
+ * - `serverAssetsChunks`: An array of build output files containing the generated assets for the server.
  */
-export declare function generateAngularServerAppManifest(additionalHtmlOutputFiles: Map<string, BuildOutputFile>, outputFiles: BuildOutputFile[], inlineCriticalCss: boolean, routes: readonly unknown[] | undefined, locale: string | undefined): string;
+export declare function generateAngularServerAppManifest(additionalHtmlOutputFiles: Map<string, BuildOutputFile>, outputFiles: BuildOutputFile[], inlineCriticalCss: boolean, routes: readonly unknown[] | undefined, locale: string | undefined): {
+    manifestContent: string;
+    serverAssetsChunks: BuildOutputFile[];
+};

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

@@ -10,7 +10,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.SERVER_APP_ENGINE_MANIFEST_FILENAME = exports.SERVER_APP_MANIFEST_FILENAME = void 0;
 exports.generateAngularServerAppEngineManifest = generateAngularServerAppEngineManifest;
 exports.generateAngularServerAppManifest = generateAngularServerAppManifest;
+const node_path_1 = require("node:path");
 const options_1 = require("../../builders/application/options");
+const bundler_context_1 = require("../../tools/esbuild/bundler-context");
+const utils_1 = require("../../tools/esbuild/utils");
 exports.SERVER_APP_MANIFEST_FILENAME = 'angular-app-manifest.mjs';
 exports.SERVER_APP_ENGINE_MANIFEST_FILENAME = 'angular-app-engine-manifest.mjs';
 const MAIN_SERVER_OUTPUT_FILENAME = 'main.server.mjs';
@@ -43,10 +46,8 @@ function escapeUnsafeChars(str) {
  * includes settings for inlining locales and determining the output structure.
  * @param baseHref - The base HREF for the application. This is used to set the base URL
  * for all relative URLs in the application.
- * @param perenderedRoutes - A record mapping static paths to their associated data.
- * @returns A string representing the content of the SSR server manifest for App Engine.
  */
-function generateAngularServerAppEngineManifest(i18nOptions, baseHref, perenderedRoutes = {}) {
+function generateAngularServerAppEngineManifest(i18nOptions, baseHref) {
     const entryPointsContent = [];
     if (i18nOptions.shouldInline) {
         for (const locale of i18nOptions.inlineLocales) {
@@ -62,22 +63,10 @@ function generateAngularServerAppEngineManifest(i18nOptions, baseHref, perendere
     else {
         entryPointsContent.push(`['', () => import('./${MAIN_SERVER_OUTPUT_FILENAME}')]`);
     }
-    const staticHeaders = [];
-    for (const [path, { headers }] of Object.entries(perenderedRoutes)) {
-        if (!headers) {
-            continue;
-        }
-        const headersValues = [];
-        for (const [name, value] of Object.entries(headers)) {
-            headersValues.push(`['${name}', '${encodeURIComponent(value)}']`);
-        }
-        staticHeaders.push(`['${path}', [${headersValues.join(', ')}]]`);
-    }
     const manifestContent = `
 export default {
   basePath: '${baseHref ?? '/'}',
   entryPoints: new Map([${entryPointsContent.join(', \n')}]),
-  staticPathsHeaders: new Map([${staticHeaders.join(', \n')}]),
 };
   `;
     return manifestContent;
@@ -101,16 +90,21 @@ export default {
  * @param locale - An optional string representing the locale or language code to be used for
  * the application, helping with localization and rendering content specific to the locale.
  *
- * @returns A string representing the content of the SSR server manifest for the Node.js
- * environment.
+ * @returns An object containing:
+ * - `manifestContent`: A string of the SSR manifest content.
+ * - `serverAssetsChunks`: An array of build output files containing the generated assets for the server.
  */
 function generateAngularServerAppManifest(additionalHtmlOutputFiles, outputFiles, inlineCriticalCss, routes, locale) {
+    const serverAssetsChunks = [];
     const serverAssetsContent = [];
     for (const file of [...additionalHtmlOutputFiles.values(), ...outputFiles]) {
-        if (file.path === options_1.INDEX_HTML_SERVER ||
-            file.path === options_1.INDEX_HTML_CSR ||
-            (inlineCriticalCss && file.path.endsWith('.css'))) {
-            serverAssetsContent.push(`['${file.path}', async () => \`${escapeUnsafeChars(file.text)}\`]`);
+        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)}]`);
         }
     }
     const manifestContent = `
@@ -118,9 +112,9 @@ export default {
   bootstrap: () => import('./main.server.mjs').then(m => m.default),
   inlineCriticalCss: ${inlineCriticalCss},
   routes: ${JSON.stringify(routes, undefined, 2)},
-  assets: new Map([${serverAssetsContent.join(', \n')}]),
+  assets: new Map([\n${serverAssetsContent.join(', \n')}\n]),
   locale: ${locale !== undefined ? `'${locale}'` : undefined},
 };
 `;
-    return manifestContent;
+    return { manifestContent, serverAssetsChunks };
 }

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

@@ -10,12 +10,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.prerenderPages = prerenderPages;
 const promises_1 = require("node:fs/promises");
 const node_path_1 = require("node:path");
-const node_url_1 = require("node:url");
 const schema_1 = require("../../builders/application/schema");
 const bundler_context_1 = require("../../tools/esbuild/bundler-context");
 const error_1 = require("../error");
 const url_1 = require("../url");
 const worker_pool_1 = require("../worker-pool");
+const utils_1 = require("./esm-in-memory-loader/utils");
 const models_1 = require("./models");
 async function prerenderPages(workspaceRoot, baseHref, appShellOptions, prerenderOptions, outputFiles, assets, outputMode, sourcemap = false, maxThreads = 1) {
     const outputFilesForWorker = {};
@@ -104,11 +104,7 @@ async function prerenderPages(workspaceRoot, baseHref, appShellOptions, prerende
 async function renderPages(baseHref, sourcemap, serializableRouteTreeNode, maxThreads, workspaceRoot, outputFilesForWorker, assetFilesForWorker, appShellOptions, outputMode) {
     const output = {};
     const errors = [];
-    const workerExecArgv = [
-        '--import',
-        // Loader cannot be an absolute path on Windows.
-        (0, node_url_1.pathToFileURL)((0, node_path_1.join)(__dirname, 'esm-in-memory-loader/register-hooks.js')).href,
-    ];
+    const workerExecArgv = [utils_1.IMPORT_EXEC_ARGV];
     if (sourcemap) {
         workerExecArgv.push('--enable-source-maps');
     }
@@ -129,8 +125,10 @@ async function renderPages(baseHref, sourcemap, serializableRouteTreeNode, maxTh
         const appShellRoute = appShellOptions && addLeadingSlash(appShellOptions.route);
         const baseHrefWithLeadingSlash = addLeadingSlash(baseHref);
         for (const { route, redirectTo, renderMode } of serializableRouteTreeNode) {
-            // Remove base href from file output path.
-            const routeWithoutBaseHref = addLeadingSlash(route.slice(baseHrefWithLeadingSlash.length - 1));
+            // Remove the base href from the file output path.
+            const routeWithoutBaseHref = addTrailingSlash(route).startsWith(baseHrefWithLeadingSlash)
+                ? addLeadingSlash(route.slice(baseHrefWithLeadingSlash.length - 1))
+                : route;
             const outPath = node_path_1.posix.join(removeLeadingSlash(routeWithoutBaseHref), 'index.html');
             if (typeof redirectTo === 'string') {
                 output[outPath] = { content: generateRedirectStaticPage(redirectTo), appShellRoute: false };
@@ -167,6 +165,7 @@ async function getAllRoutes(workspaceRoot, baseHref, outputFilesForWorker, asset
     const routes = [];
     if (appShellOptions) {
         routes.push({
+            renderMode: models_1.RouteRenderMode.AppShell,
             route: (0, url_1.urlJoin)(baseHref, appShellOptions.route),
         });
     }
@@ -174,6 +173,7 @@ async function getAllRoutes(workspaceRoot, baseHref, outputFilesForWorker, asset
         const routesFromFile = (await (0, promises_1.readFile)(routesFile, 'utf8')).split(/\r?\n/);
         for (const route of routesFromFile) {
             routes.push({
+                renderMode: models_1.RouteRenderMode.Prerender,
                 route: (0, url_1.urlJoin)(baseHref, route.trim()),
             });
         }
@@ -181,11 +181,7 @@ async function getAllRoutes(workspaceRoot, baseHref, outputFilesForWorker, asset
     if (!discoverRoutes) {
         return { errors: [], serializedRouteTree: routes };
     }
-    const workerExecArgv = [
-        '--import',
-        // Loader cannot be an absolute path on Windows.
-        (0, node_url_1.pathToFileURL)((0, node_path_1.join)(__dirname, 'esm-in-memory-loader/register-hooks.js')).href,
-    ];
+    const workerExecArgv = [utils_1.IMPORT_EXEC_ARGV];
     if (sourcemap) {
         workerExecArgv.push('--enable-source-maps');
     }
@@ -203,7 +199,17 @@ async function getAllRoutes(workspaceRoot, baseHref, outputFilesForWorker, asset
     });
     try {
         const { serializedRouteTree, errors } = await renderWorker.run({});
-        return { errors, serializedRouteTree: [...routes, ...serializedRouteTree] };
+        if (!routes.length) {
+            return { errors, serializedRouteTree };
+        }
+        // Merge the routing trees
+        const uniqueRoutes = new Map();
+        for (const item of [...routes, ...serializedRouteTree]) {
+            if (!uniqueRoutes.has(item.route)) {
+                uniqueRoutes.set(item.route, item);
+            }
+        }
+        return { errors, serializedRouteTree: Array.from(uniqueRoutes.values()) };
     }
     catch (err) {
         (0, error_1.assertIsError)(err);
@@ -219,10 +225,13 @@ async function getAllRoutes(workspaceRoot, baseHref, outputFilesForWorker, asset
     }
 }
 function addLeadingSlash(value) {
-    return value.charAt(0) === '/' ? value : '/' + value;
+    return value[0] === '/' ? value : '/' + value;
+}
+function addTrailingSlash(url) {
+    return url[url.length - 1] === '/' ? url : `${url}/`;
 }
 function removeLeadingSlash(value) {
-    return value.charAt(0) === '/' ? value.slice(1) : value;
+    return value[0] === '/' ? value.slice(1) : value;
 }
 /**
  * Generates a static HTML page with a meta refresh tag to redirect the user to a specified URL.

package/src/utils/server-rendering/render-worker.js

@@ -21,8 +21,10 @@ let serverURL = launch_server_1.DEFAULT_URL;
  */
 async function renderPage({ url }) {
     const { ɵgetOrCreateAngularServerApp: getOrCreateAngularServerApp } = await (0, load_esm_from_memory_1.loadEsmModuleFromMemory)('./main.server.mjs');
-    const angularServerApp = getOrCreateAngularServerApp();
-    const response = await angularServerApp.renderStatic(new URL(url, serverURL), AbortSignal.timeout(30_000));
+    const angularServerApp = getOrCreateAngularServerApp({
+        allowStaticRouteRender: true,
+    });
+    const response = await angularServerApp.handle(new Request(new URL(url, serverURL), { signal: AbortSignal.timeout(30_000) }));
     return response ? response.text() : null;
 }
 async function initialize() {