@angular/build 19.0.0-next.6 → 19.0.0-next.8

package/src/tools/vite/middlewares/html-fallback-middleware.d.ts

@@ -7,4 +7,4 @@
  */
 import type { ServerResponse } from 'node:http';
 import type { Connect } from 'vite';
-export declare function angularHtmlFallbackMiddleware(req: Connect.IncomingMessage, res: ServerResponse, next: Connect.NextFunction): void;
+export declare function angularHtmlFallbackMiddleware(req: Connect.IncomingMessage, _res: ServerResponse, next: Connect.NextFunction): void;

package/src/tools/vite/middlewares/html-fallback-middleware.js

@@ -9,15 +9,31 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.angularHtmlFallbackMiddleware = angularHtmlFallbackMiddleware;
 const utils_1 = require("../utils");
-function angularHtmlFallbackMiddleware(req, res, next) {
+const ALLOWED_FALLBACK_METHODS = Object.freeze(['GET', 'HEAD']);
+function angularHtmlFallbackMiddleware(req, _res, next) {
     // Similar to how it is handled in vite
     // https://github.com/vitejs/vite/blob/main/packages/vite/src/node/server/middlewares/htmlFallback.ts#L15C19-L15C45
-    if ((req.method === 'GET' || req.method === 'HEAD') &&
-        (!req.url || !(0, utils_1.lookupMimeTypeFromRequest)(req.url)) &&
-        (!req.headers.accept ||
-            req.headers.accept.includes('text/html') ||
-            req.headers.accept.includes('text/*') ||
-            req.headers.accept.includes('*/*'))) {
+    if (!req.method || !ALLOWED_FALLBACK_METHODS.includes(req.method)) {
+        // No fallback for unsupported request methods
+        next();
+        return;
+    }
+    if (req.url) {
+        const mimeType = (0, utils_1.lookupMimeTypeFromRequest)(req.url);
+        if (mimeType === 'text/html' || mimeType === 'application/xhtml+xml') {
+            // eslint-disable-next-line no-console
+            console.warn(`Request for HTML file "${req.url}" was received but no asset found. Asset may be missing from build.`);
+        }
+        else if (mimeType) {
+            // No fallback for request of asset-like files
+            next();
+            return;
+        }
+    }
+    if (!req.headers.accept ||
+        req.headers.accept.includes('text/html') ||
+        req.headers.accept.includes('text/*') ||
+        req.headers.accept.includes('*/*')) {
         req.url = '/index.html';
     }
     next();

package/src/tools/vite/middlewares/index-html-middleware.js

@@ -11,7 +11,7 @@ exports.createAngularIndexHtmlMiddleware = createAngularIndexHtmlMiddleware;
 const node_path_1 = require("node:path");
 const utils_1 = require("../utils");
 function createAngularIndexHtmlMiddleware(server, outputFiles, indexHtmlTransformer) {
-    return function (req, res, next) {
+    return function angularIndexHtmlMiddleware(req, res, next) {
         if (!req.url) {
             next();
             return;
@@ -37,7 +37,6 @@ function createAngularIndexHtmlMiddleware(server, outputFiles, indexHtmlTransfor
             }
             res.setHeader('Content-Type', 'text/html');
             res.setHeader('Cache-Control', 'no-cache');
-            (0, utils_1.appendServerConfiguredHeaders)(server, res);
             res.end(processedHtml);
         })
             .catch((error) => next(error));

package/src/tools/vite/middlewares/index.d.ts

@@ -8,4 +8,5 @@
 export { createAngularAssetsMiddleware } from './assets-middleware';
 export { angularHtmlFallbackMiddleware } from './html-fallback-middleware';
 export { createAngularIndexHtmlMiddleware } from './index-html-middleware';
-export { createAngularSSRMiddleware } from './ssr-middleware';
+export { createAngularSsrExternalMiddleware, createAngularSsrInternalMiddleware, } from './ssr-middleware';
+export { createAngularHeadersMiddleware } from './headers-middleware';

package/src/tools/vite/middlewares/index.js

@@ -7,7 +7,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createAngularSSRMiddleware = exports.createAngularIndexHtmlMiddleware = exports.angularHtmlFallbackMiddleware = exports.createAngularAssetsMiddleware = void 0;
+exports.createAngularHeadersMiddleware = exports.createAngularSsrInternalMiddleware = exports.createAngularSsrExternalMiddleware = exports.createAngularIndexHtmlMiddleware = exports.angularHtmlFallbackMiddleware = exports.createAngularAssetsMiddleware = void 0;
 var assets_middleware_1 = require("./assets-middleware");
 Object.defineProperty(exports, "createAngularAssetsMiddleware", { enumerable: true, get: function () { return assets_middleware_1.createAngularAssetsMiddleware; } });
 var html_fallback_middleware_1 = require("./html-fallback-middleware");
@@ -15,4 +15,7 @@ Object.defineProperty(exports, "angularHtmlFallbackMiddleware", { enumerable: tr
 var index_html_middleware_1 = require("./index-html-middleware");
 Object.defineProperty(exports, "createAngularIndexHtmlMiddleware", { enumerable: true, get: function () { return index_html_middleware_1.createAngularIndexHtmlMiddleware; } });
 var ssr_middleware_1 = require("./ssr-middleware");
-Object.defineProperty(exports, "createAngularSSRMiddleware", { enumerable: true, get: function () { return ssr_middleware_1.createAngularSSRMiddleware; } });
+Object.defineProperty(exports, "createAngularSsrExternalMiddleware", { enumerable: true, get: function () { return ssr_middleware_1.createAngularSsrExternalMiddleware; } });
+Object.defineProperty(exports, "createAngularSsrInternalMiddleware", { enumerable: true, get: function () { return ssr_middleware_1.createAngularSsrInternalMiddleware; } });
+var headers_middleware_1 = require("./headers-middleware");
+Object.defineProperty(exports, "createAngularHeadersMiddleware", { enumerable: true, get: function () { return headers_middleware_1.createAngularHeadersMiddleware; } });

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

@@ -6,4 +6,5 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 import type { Connect, ViteDevServer } from 'vite';
-export declare function createAngularSSRMiddleware(server: ViteDevServer, indexHtmlTransformer?: (content: string) => Promise<string>): Connect.NextHandleFunction;
+export declare function createAngularSsrInternalMiddleware(server: ViteDevServer, indexHtmlTransformer?: (content: string) => Promise<string>): Connect.NextHandleFunction;
+export declare function createAngularSsrExternalMiddleware(server: ViteDevServer, indexHtmlTransformer?: (content: string) => Promise<string>): Promise<Connect.NextHandleFunction>;

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

@@ -7,38 +7,82 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createAngularSSRMiddleware = createAngularSSRMiddleware;
-const utils_1 = require("../utils");
-function createAngularSSRMiddleware(server, indexHtmlTransformer) {
+exports.createAngularSsrInternalMiddleware = createAngularSsrInternalMiddleware;
+exports.createAngularSsrExternalMiddleware = createAngularSsrExternalMiddleware;
+const load_esm_1 = require("../../../utils/load-esm");
+function createAngularSsrInternalMiddleware(server, indexHtmlTransformer) {
     let cachedAngularServerApp;
-    return function (req, res, next) {
+    return function angularSsrMiddleware(req, res, next) {
         if (req.url === undefined) {
             return next();
         }
-        const resolvedUrls = server.resolvedUrls;
-        const baseUrl = resolvedUrls?.local[0] ?? resolvedUrls?.network[0];
-        const url = new URL(req.url, baseUrl);
         (async () => {
+            const { writeResponseToNodeResponse, createWebRequestFromNodeRequest } = await (0, load_esm_1.loadEsmModule)('@angular/ssr/node');
             const { ɵgetOrCreateAngularServerApp } = (await server.ssrLoadModule('/main.server.mjs'));
             const angularServerApp = ɵgetOrCreateAngularServerApp();
             // Only Add the transform hook only if it's a different instance.
             if (cachedAngularServerApp !== angularServerApp) {
-                angularServerApp.hooks.on('html:transform:pre', async ({ html }) => {
+                angularServerApp.hooks.on('html:transform:pre', async ({ html, url }) => {
                     const processedHtml = await server.transformIndexHtml(url.pathname, html);
                     return indexHtmlTransformer?.(processedHtml) ?? processedHtml;
                 });
                 cachedAngularServerApp = angularServerApp;
             }
-            const response = await angularServerApp.render(new Request(url, { signal: AbortSignal.timeout(30_000) }), undefined);
-            return response?.text();
-        })()
-            .then((content) => {
-            if (typeof content !== 'string') {
+            const webReq = new Request(createWebRequestFromNodeRequest(req), {
+                signal: AbortSignal.timeout(30_000),
+            });
+            const webRes = await angularServerApp.render(webReq);
+            if (!webRes) {
                 return next();
             }
-            (0, utils_1.appendServerConfiguredHeaders)(server, res);
-            res.end(content);
-        })
-            .catch((error) => next(error));
+            return writeResponseToNodeResponse(webRes, res);
+        })().catch(next);
     };
 }
+async function createAngularSsrExternalMiddleware(server, indexHtmlTransformer) {
+    let fallbackWarningShown = false;
+    let cachedAngularAppEngine;
+    let angularSsrInternalMiddleware;
+    const { createWebRequestFromNodeRequest, writeResponseToNodeResponse } = await (0, load_esm_1.loadEsmModule)('@angular/ssr/node');
+    return function angularSsrExternalMiddleware(req, res, next) {
+        (async () => {
+            const { default: handler, AngularAppEngine } = (await server.ssrLoadModule('./server.mjs'));
+            if (!isSsrNodeRequestHandler(handler) && !isSsrRequestHandler(handler)) {
+                if (!fallbackWarningShown) {
+                    // eslint-disable-next-line no-console
+                    console.warn(`The default export in 'server.ts' does not provide a Node.js request handler. ` +
+                        'Using the internal SSR middleware instead.');
+                    fallbackWarningShown = true;
+                }
+                angularSsrInternalMiddleware ??= createAngularSsrInternalMiddleware(server, indexHtmlTransformer);
+                angularSsrInternalMiddleware(req, res, next);
+                return;
+            }
+            if (cachedAngularAppEngine !== AngularAppEngine) {
+                AngularAppEngine.ɵhooks.on('html:transform:pre', async ({ html, url }) => {
+                    const processedHtml = await server.transformIndexHtml(url.pathname, html);
+                    return indexHtmlTransformer?.(processedHtml) ?? processedHtml;
+                });
+                cachedAngularAppEngine = AngularAppEngine;
+            }
+            // Forward the request to the middleware in server.ts
+            if (isSsrNodeRequestHandler(handler)) {
+                await handler(req, res, next);
+            }
+            else {
+                const webRes = await handler(createWebRequestFromNodeRequest(req));
+                if (!webRes) {
+                    next();
+                    return;
+                }
+                await writeResponseToNodeResponse(webRes, res);
+            }
+        })().catch(next);
+    };
+}
+function isSsrNodeRequestHandler(value) {
+    return typeof value === 'function' && '__ng_node_request_handler__' in value;
+}
+function isSsrRequestHandler(value) {
+    return typeof value === 'function' && '__ng_request_handler__' in value;
+}

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

@@ -0,0 +1,16 @@
+/**
+ * @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
+ */
+import type { Plugin } from 'vite';
+import { AngularMemoryOutputFiles } from '../utils';
+interface AngularMemoryPluginOptions {
+    virtualProjectRoot: string;
+    outputFiles: AngularMemoryOutputFiles;
+    external?: string[];
+}
+export declare function createAngularMemoryPlugin(options: AngularMemoryPluginOptions): Promise<Plugin>;
+export {};

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

@@ -11,13 +11,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createAngularMemoryPlugin = createAngularMemoryPlugin;
-const remapping_1 = __importDefault(require("@ampproject/remapping"));
 const node_assert_1 = __importDefault(require("node:assert"));
 const promises_1 = require("node:fs/promises");
 const node_path_1 = require("node:path");
-const middlewares_1 = require("./middlewares");
-function createAngularMemoryPlugin(options) {
-    const { workspaceRoot, virtualProjectRoot, outputFiles, assets, external, ssr, extensionMiddleware, indexHtmlTransformer, normalizePath, usedComponentStyles, } = options;
+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
@@ -29,11 +31,19 @@ function createAngularMemoryPlugin(options) {
                 // `/@id/${source}` but is currently closer to a raw external than a resolved file path.
                 return source;
             }
-            if (importer && source[0] === '.' && normalizePath(importer).startsWith(virtualProjectRoot)) {
-                // Remove query if present
-                const [importerFile] = importer.split('?', 1);
-                source =
-                    '/' + normalizePath((0, node_path_1.join)((0, node_path_1.dirname)((0, node_path_1.relative)(virtualProjectRoot, importerFile)), 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);
+                }
             }
             const [file] = source.split('?', 1);
             if (outputFiles.has(file)) {
@@ -58,37 +68,6 @@ function createAngularMemoryPlugin(options) {
                 map: mapContents && Buffer.from(mapContents).toString('utf-8'),
             };
         },
-        // eslint-disable-next-line max-lines-per-function
-        configureServer(server) {
-            const originalssrTransform = server.ssrTransform;
-            server.ssrTransform = async (code, map, url, originalCode) => {
-                const result = await originalssrTransform(code, null, url, originalCode);
-                if (!result || !result.map || !map) {
-                    return result;
-                }
-                const remappedMap = (0, remapping_1.default)([result.map, map], () => null);
-                // Set the sourcemap root to the workspace root. This is needed since we set a virtual path as root.
-                remappedMap.sourceRoot = normalizePath(workspaceRoot) + '/';
-                return {
-                    ...result,
-                    map: remappedMap,
-                };
-            };
-            // Assets and resources get handled first
-            server.middlewares.use((0, middlewares_1.createAngularAssetsMiddleware)(server, assets, outputFiles, usedComponentStyles));
-            if (extensionMiddleware?.length) {
-                extensionMiddleware.forEach((middleware) => server.middlewares.use(middleware));
-            }
-            // Returning a function, installs middleware after the main transform middleware but
-            // before the built-in HTML middleware
-            return () => {
-                if (ssr) {
-                    server.middlewares.use((0, middlewares_1.createAngularSSRMiddleware)(server, indexHtmlTransformer));
-                }
-                server.middlewares.use(middlewares_1.angularHtmlFallbackMiddleware);
-                server.middlewares.use((0, middlewares_1.createAngularIndexHtmlMiddleware)(server, outputFiles, indexHtmlTransformer));
-            };
-        },
     };
 }
 /**

package/src/tools/vite/{i18n-locale-plugin.d.ts → plugins/i18n-locale-plugin.d.ts}

@@ -6,10 +6,6 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 import type { Plugin } from 'vite';
-/**
- * The base module location used to search for locale specific data.
- */
-export declare const LOCALE_DATA_BASE_MODULE = "@angular/common/locales/global";
 /**
  * Creates a Vite plugin that resolves Angular locale data files from `@angular/common`.
  *

package/src/tools/vite/{i18n-locale-plugin.js → plugins/i18n-locale-plugin.js}

@@ -7,12 +7,11 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.LOCALE_DATA_BASE_MODULE = void 0;
 exports.createAngularLocaleDataPlugin = createAngularLocaleDataPlugin;
 /**
  * The base module location used to search for locale specific data.
  */
-exports.LOCALE_DATA_BASE_MODULE = '@angular/common/locales/global';
+const LOCALE_DATA_BASE_MODULE = '@angular/common/locales/global';
 /**
  * Creates a Vite plugin that resolves Angular locale data files from `@angular/common`.
  *
@@ -32,7 +31,7 @@ function createAngularLocaleDataPlugin() {
             let partialLocale = originalLocale.replace(/-x(-[a-zA-Z0-9]{1,8})+$/, '');
             let exact = true;
             while (partialLocale) {
-                const potentialPath = `${exports.LOCALE_DATA_BASE_MODULE}/${partialLocale}`;
+                const potentialPath = `${LOCALE_DATA_BASE_MODULE}/${partialLocale}`;
                 const result = await this.resolve(potentialPath);
                 if (result) {
                     if (!exact) {

package/src/tools/vite/plugins/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @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 { createAngularMemoryPlugin } from './angular-memory-plugin';
+export { createAngularLocaleDataPlugin } from './i18n-locale-plugin';
+export { createRemoveIdPrefixPlugin } from './id-prefix-plugin';
+export { createAngularSetupMiddlewaresPlugin, ServerSsrMode } from './setup-middlewares-plugin';
+export { createAngularSsrTransformPlugin } from './ssr-transform-plugin';

package/src/tools/vite/plugins/index.js

@@ -0,0 +1,21 @@
+"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.createAngularSsrTransformPlugin = exports.ServerSsrMode = exports.createAngularSetupMiddlewaresPlugin = exports.createRemoveIdPrefixPlugin = exports.createAngularLocaleDataPlugin = exports.createAngularMemoryPlugin = void 0;
+var angular_memory_plugin_1 = require("./angular-memory-plugin");
+Object.defineProperty(exports, "createAngularMemoryPlugin", { enumerable: true, get: function () { return angular_memory_plugin_1.createAngularMemoryPlugin; } });
+var i18n_locale_plugin_1 = require("./i18n-locale-plugin");
+Object.defineProperty(exports, "createAngularLocaleDataPlugin", { enumerable: true, get: function () { return i18n_locale_plugin_1.createAngularLocaleDataPlugin; } });
+var id_prefix_plugin_1 = require("./id-prefix-plugin");
+Object.defineProperty(exports, "createRemoveIdPrefixPlugin", { enumerable: true, get: function () { return id_prefix_plugin_1.createRemoveIdPrefixPlugin; } });
+var setup_middlewares_plugin_1 = require("./setup-middlewares-plugin");
+Object.defineProperty(exports, "createAngularSetupMiddlewaresPlugin", { enumerable: true, get: function () { return setup_middlewares_plugin_1.createAngularSetupMiddlewaresPlugin; } });
+Object.defineProperty(exports, "ServerSsrMode", { enumerable: true, get: function () { return setup_middlewares_plugin_1.ServerSsrMode; } });
+var ssr_transform_plugin_1 = require("./ssr-transform-plugin");
+Object.defineProperty(exports, "createAngularSsrTransformPlugin", { enumerable: true, get: function () { return ssr_transform_plugin_1.createAngularSsrTransformPlugin; } });

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

@@ -0,0 +1,41 @@
+/**
+ * @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
+ */
+import type { Connect, Plugin } from 'vite';
+import { AngularMemoryOutputFiles } from '../utils';
+export declare enum ServerSsrMode {
+    /**
+     * No SSR
+     */
+    NoSsr = 0,
+    /**
+     * Internal server-side rendering (SSR) is handled through the built-in middleware.
+     *
+     * In this mode, the SSR process is managed internally by the dev-server's middleware.
+     * The server automatically renders pages on the server without requiring external
+     * middleware or additional configuration from the developer.
+     */
+    InternalSsrMiddleware = 1,
+    /**
+     * External server-side rendering (SSR) is handled by a custom middleware defined in server.ts.
+     *
+     * This mode allows developers to define custom SSR behavior by providing a middleware in the
+     * `server.ts` file. It gives more flexibility for handling SSR, such as integrating with other
+     * frameworks or customizing the rendering pipeline.
+     */
+    ExternalSsrMiddleware = 2
+}
+interface AngularSetupMiddlewaresPluginOptions {
+    outputFiles: AngularMemoryOutputFiles;
+    assets: Map<string, string>;
+    extensionMiddleware?: Connect.NextHandleFunction[];
+    indexHtmlTransformer?: (content: string) => Promise<string>;
+    usedComponentStyles: Map<string, string[]>;
+    ssrMode: ServerSsrMode;
+}
+export declare function createAngularSetupMiddlewaresPlugin(options: AngularSetupMiddlewaresPluginOptions): Plugin;
+export {};

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

@@ -0,0 +1,62 @@
+"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.ServerSsrMode = void 0;
+exports.createAngularSetupMiddlewaresPlugin = createAngularSetupMiddlewaresPlugin;
+const middlewares_1 = require("../middlewares");
+var ServerSsrMode;
+(function (ServerSsrMode) {
+    /**
+     * No SSR
+     */
+    ServerSsrMode[ServerSsrMode["NoSsr"] = 0] = "NoSsr";
+    /**
+     * Internal server-side rendering (SSR) is handled through the built-in middleware.
+     *
+     * In this mode, the SSR process is managed internally by the dev-server's middleware.
+     * The server automatically renders pages on the server without requiring external
+     * middleware or additional configuration from the developer.
+     */
+    ServerSsrMode[ServerSsrMode["InternalSsrMiddleware"] = 1] = "InternalSsrMiddleware";
+    /**
+     * External server-side rendering (SSR) is handled by a custom middleware defined in server.ts.
+     *
+     * This mode allows developers to define custom SSR behavior by providing a middleware in the
+     * `server.ts` file. It gives more flexibility for handling SSR, such as integrating with other
+     * frameworks or customizing the rendering pipeline.
+     */
+    ServerSsrMode[ServerSsrMode["ExternalSsrMiddleware"] = 2] = "ExternalSsrMiddleware";
+})(ServerSsrMode || (exports.ServerSsrMode = ServerSsrMode = {}));
+function createAngularSetupMiddlewaresPlugin(options) {
+    return {
+        name: 'vite:angular-setup-middlewares',
+        enforce: 'pre',
+        configureServer(server) {
+            const { indexHtmlTransformer, outputFiles, extensionMiddleware, assets, usedComponentStyles, ssrMode, } = options;
+            // Headers, assets and resources get handled first
+            server.middlewares.use((0, middlewares_1.createAngularHeadersMiddleware)(server));
+            server.middlewares.use((0, middlewares_1.createAngularAssetsMiddleware)(server, assets, outputFiles, usedComponentStyles));
+            extensionMiddleware?.forEach((middleware) => server.middlewares.use(middleware));
+            // Returning a function, installs middleware after the main transform middleware but
+            // before the built-in HTML middleware
+            // eslint-disable-next-line @typescript-eslint/no-misused-promises
+            return async () => {
+                if (ssrMode === ServerSsrMode.ExternalSsrMiddleware) {
+                    server.middlewares.use(await (0, middlewares_1.createAngularSsrExternalMiddleware)(server, indexHtmlTransformer));
+                    return;
+                }
+                if (ssrMode === ServerSsrMode.InternalSsrMiddleware) {
+                    server.middlewares.use((0, middlewares_1.createAngularSsrInternalMiddleware)(server, indexHtmlTransformer));
+                }
+                server.middlewares.use(middlewares_1.angularHtmlFallbackMiddleware);
+                server.middlewares.use((0, middlewares_1.createAngularIndexHtmlMiddleware)(server, outputFiles, indexHtmlTransformer));
+            };
+        },
+    };
+}

package/src/tools/vite/plugins/ssr-transform-plugin.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @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
+ */
+import type { Plugin } from 'vite';
+export declare function createAngularSsrTransformPlugin(workspaceRoot: string): Promise<Plugin>;

package/src/tools/vite/plugins/ssr-transform-plugin.js

@@ -0,0 +1,38 @@
+"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
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createAngularSsrTransformPlugin = createAngularSsrTransformPlugin;
+const remapping_1 = __importDefault(require("@ampproject/remapping"));
+const load_esm_1 = require("../../../utils/load-esm");
+async function createAngularSsrTransformPlugin(workspaceRoot) {
+    const { normalizePath } = await (0, load_esm_1.loadEsmModule)('vite');
+    return {
+        name: 'vite:angular-ssr-transform',
+        enforce: 'pre',
+        async configureServer(server) {
+            const originalssrTransform = server.ssrTransform;
+            server.ssrTransform = async (code, map, url, originalCode) => {
+                const result = await originalssrTransform(code, null, url, originalCode);
+                if (!result || !result.map || !map) {
+                    return result;
+                }
+                const remappedMap = (0, remapping_1.default)([result.map, map], () => null);
+                // Set the sourcemap root to the workspace root. This is needed since we set a virtual path as root.
+                remappedMap.sourceRoot = normalizePath(workspaceRoot) + '/';
+                return {
+                    ...result,
+                    map: remappedMap,
+                };
+            };
+        },
+    };
+}

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

@@ -5,12 +5,9 @@
  * 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 type { IncomingMessage, ServerResponse } from 'node:http';
-import type { ViteDevServer } from 'vite';
 export type AngularMemoryOutputFiles = Map<string, {
     contents: Uint8Array;
     servable: boolean;
 }>;
 export declare function pathnameWithoutBasePath(url: string, basePath: string): string;
 export declare function lookupMimeTypeFromRequest(url: string): string | undefined;
-export declare function appendServerConfiguredHeaders(server: ViteDevServer, res: ServerResponse<IncomingMessage>): void;

package/src/tools/vite/utils.js

@@ -9,7 +9,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.pathnameWithoutBasePath = pathnameWithoutBasePath;
 exports.lookupMimeTypeFromRequest = lookupMimeTypeFromRequest;
-exports.appendServerConfiguredHeaders = appendServerConfiguredHeaders;
 const mrmime_1 = require("mrmime");
 const node_path_1 = require("node:path");
 function pathnameWithoutBasePath(url, basePath) {
@@ -27,14 +26,3 @@ function lookupMimeTypeFromRequest(url) {
     }
     return extension && (0, mrmime_1.lookup)(extension);
 }
-function appendServerConfiguredHeaders(server, res) {
-    const headers = server.config.server.headers;
-    if (!headers) {
-        return;
-    }
-    for (const [name, value] of Object.entries(headers)) {
-        if (value !== undefined) {
-            res.setHeader(name, value);
-        }
-    }
-}

package/src/typings.d.ts

@@ -17,3 +17,10 @@
 declare module 'esbuild' {
   export * from 'esbuild-wasm';
 }
+
+/**
+ * Augment the Node.js module builtin types to support the v22.8+ compile cache functions
+ */
+declare module 'node:module' {
+  function getCompileCacheDir(): string | undefined;
+}

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

@@ -15,3 +15,5 @@ export declare const shouldWatchRoot: boolean;
 export declare const useTypeChecking: boolean;
 export declare const useJSONBuildLogs: boolean;
 export declare const shouldOptimizeChunks: boolean;
+export declare const useComponentStyleHmr: 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.shouldOptimizeChunks = exports.useJSONBuildLogs = exports.useTypeChecking = exports.shouldWatchRoot = exports.debugPerformance = exports.useParallelTs = exports.maxWorkers = exports.allowMinify = exports.shouldBeautify = exports.allowMangle = void 0;
+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;
 const node_os_1 = require("node:os");
 function isDisabled(variable) {
     return variable === '0' || variable.toLowerCase() === 'false';
@@ -82,3 +82,7 @@ const buildLogsJsonVariable = process.env['NG_BUILD_LOGS_JSON'];
 exports.useJSONBuildLogs = isPresent(buildLogsJsonVariable) && isEnabled(buildLogsJsonVariable);
 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) && isEnabled(hmrComponentStylesVariable);
+const partialSsrBuildVariable = process.env['NG_BUILD_PARTIAL_SSR'];
+exports.usePartialSsrBuild = isPresent(partialSsrBuildVariable) && isEnabled(partialSsrBuildVariable);

package/src/utils/index-file/valid-self-closing-tags.js

@@ -25,6 +25,7 @@ exports.VALID_SELF_CLOSING_TAGS = new Set([
     'track',
     'wbr',
     /** SVG tags */
+    'animate',
     'circle',
     'ellipse',
     'line',

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