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

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

@@ -14,6 +14,7 @@ exports.createBrowserCodeBundleOptions = createBrowserCodeBundleOptions;
 exports.createBrowserPolyfillBundleOptions = createBrowserPolyfillBundleOptions;
 exports.createServerPolyfillBundleOptions = createServerPolyfillBundleOptions;
 exports.createServerMainCodeBundleOptions = createServerMainCodeBundleOptions;
+exports.createSsrEntryCodeBundleOptions = createSsrEntryCodeBundleOptions;
 const node_assert_1 = __importDefault(require("node:assert"));
 const node_crypto_1 = require("node:crypto");
 const node_path_1 = require("node:path");
@@ -156,7 +157,7 @@ function createServerPolyfillBundleOptions(options, target, sourceFileCache) {
     return () => buildOptions;
 }
 function createServerMainCodeBundleOptions(options, target, sourceFileCache) {
-    const { serverEntryPoint: mainServerEntryPoint, workspaceRoot, externalPackages, ssrOptions, polyfills, } = options;
+    const { serverEntryPoint: mainServerEntryPoint, workspaceRoot, outputMode, externalPackages, ssrOptions, polyfills, } = options;
     (0, node_assert_1.default)(mainServerEntryPoint, 'createServerCodeBundleOptions should not be called without a defined serverEntryPoint.');
     const { pluginOptions, styleOptions } = (0, compiler_plugin_options_1.createCompilerPluginOptions)(options, target, sourceFileCache);
     const mainServerNamespace = 'angular:main-server';
@@ -167,7 +168,8 @@ function createServerMainCodeBundleOptions(options, target, sourceFileCache) {
         'main.server': mainServerNamespace,
     };
     const ssrEntryPoint = ssrOptions?.entry;
-    if (ssrEntryPoint) {
+    const isOldBehaviour = !outputMode;
+    if (ssrEntryPoint && isOldBehaviour) {
         // Old behavior: 'server.ts' was bundled together with the SSR (Server-Side Rendering) code.
         // This approach combined server-side logic and rendering into a single bundle.
         entryPoints['server'] = ssrEntryPoint;
@@ -249,6 +251,111 @@ function createServerMainCodeBundleOptions(options, target, sourceFileCache) {
     }
     return buildOptions;
 }
+function createSsrEntryCodeBundleOptions(options, target, sourceFileCache) {
+    const { workspaceRoot, ssrOptions, externalPackages } = options;
+    const serverEntryPoint = ssrOptions?.entry;
+    (0, node_assert_1.default)(serverEntryPoint, 'createSsrEntryCodeBundleOptions should not be called without a defined serverEntryPoint.');
+    const { pluginOptions, styleOptions } = (0, compiler_plugin_options_1.createCompilerPluginOptions)(options, target, sourceFileCache);
+    const ssrEntryNamespace = 'angular:ssr-entry';
+    const ssrInjectManifestNamespace = 'angular:ssr-entry-inject-manifest';
+    const ssrInjectRequireNamespace = 'angular:ssr-entry-inject-require';
+    const buildOptions = {
+        ...getEsBuildServerCommonOptions(options),
+        target,
+        entryPoints: {
+            // TODO: consider renaming to index
+            'server': ssrEntryNamespace,
+        },
+        supported: (0, utils_1.getFeatureSupport)(target, true),
+        plugins: [
+            (0, sourcemap_ignorelist_plugin_1.createSourcemapIgnorelistPlugin)(),
+            (0, compiler_plugin_1.createCompilerPlugin)(
+            // JS/TS options
+            { ...pluginOptions, noopTypeScriptCompilation: true }, 
+            // Component stylesheet options
+            styleOptions),
+        ],
+        inject: [ssrInjectRequireNamespace, ssrInjectManifestNamespace],
+    };
+    buildOptions.plugins ??= [];
+    if (externalPackages) {
+        buildOptions.packages = 'external';
+    }
+    else {
+        buildOptions.plugins.push((0, rxjs_esm_resolution_plugin_1.createRxjsEsmResolutionPlugin)());
+    }
+    // Mark manifest file as external. As this will be generated later on.
+    (buildOptions.external ??= []).push('*/main.server.mjs', ...utils_1.SERVER_GENERATED_EXTERNALS);
+    buildOptions.plugins.push({
+        name: 'angular-ssr-metadata',
+        setup(build) {
+            build.onEnd((result) => {
+                if (result.metafile) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    result.metafile['ng-ssr-entry-bundle'] = true;
+                }
+            });
+        },
+    }, (0, virtual_module_plugin_1.createVirtualModulePlugin)({
+        namespace: ssrInjectRequireNamespace,
+        cache: sourceFileCache?.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: sourceFileCache?.loadResultCache,
+        loadContent: () => {
+            const contents = [
+                // Configure `@angular/ssr` app engine manifest.
+                `import manifest from './${manifest_1.SERVER_APP_ENGINE_MANIFEST_FILENAME}';`,
+                `import { ɵsetAngularAppEngineManifest } from '@angular/ssr';`,
+                `ɵsetAngularAppEngineManifest(manifest);`,
+            ];
+            return {
+                contents: contents.join('\n'),
+                loader: 'js',
+                resolveDir: workspaceRoot,
+            };
+        },
+    }), (0, virtual_module_plugin_1.createVirtualModulePlugin)({
+        namespace: ssrEntryNamespace,
+        cache: sourceFileCache?.loadResultCache,
+        loadContent: () => {
+            const serverEntryPointJsImport = entryFileToWorkspaceRelative(workspaceRoot, serverEntryPoint);
+            const contents = [
+                // Re-export all symbols including default export
+                `import * as server from '${serverEntryPointJsImport}';`,
+                `export * from '${serverEntryPointJsImport}';`,
+                // The below is needed to avoid
+                // `Import "default" will always be undefined because there is no matching export` warning when no default is present.
+                `const defaultExportName = 'default';`,
+                `export default server[defaultExportName]`,
+                // Add @angular/ssr exports
+                `export { AngularAppEngine } from '@angular/ssr';`,
+            ];
+            return {
+                contents: contents.join('\n'),
+                loader: 'js',
+                resolveDir: workspaceRoot,
+            };
+        },
+    }));
+    if (options.plugins) {
+        buildOptions.plugins.push(...options.plugins);
+    }
+    return buildOptions;
+}
 function getEsBuildServerCommonOptions(options) {
     return {
         ...getEsBuildCommonOptions(options),

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

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

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

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

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

@@ -18,9 +18,10 @@ const load_result_cache_1 = require("./load-result-cache");
 const utils_1 = require("./utils");
 var BuildOutputFileType;
 (function (BuildOutputFileType) {
-    BuildOutputFileType[BuildOutputFileType["Browser"] = 1] = "Browser";
-    BuildOutputFileType[BuildOutputFileType["Media"] = 2] = "Media";
-    BuildOutputFileType[BuildOutputFileType["Server"] = 3] = "Server";
+    BuildOutputFileType[BuildOutputFileType["Browser"] = 0] = "Browser";
+    BuildOutputFileType[BuildOutputFileType["Media"] = 1] = "Media";
+    BuildOutputFileType[BuildOutputFileType["ServerApplication"] = 2] = "ServerApplication";
+    BuildOutputFileType[BuildOutputFileType["ServerRoot"] = 3] = "ServerRoot";
     BuildOutputFileType[BuildOutputFileType["Root"] = 4] = "Root";
 })(BuildOutputFileType || (exports.BuildOutputFileType = BuildOutputFileType = {}));
 /**
@@ -292,7 +293,10 @@ class BundlerContext {
                 fileType = BuildOutputFileType.Media;
             }
             else if (this.#platformIsServer) {
-                fileType = BuildOutputFileType.Server;
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                fileType = result.metafile['ng-ssr-entry-bundle']
+                    ? BuildOutputFileType.ServerRoot
+                    : BuildOutputFileType.ServerApplication;
             }
             else {
                 fileType = BuildOutputFileType.Browser;

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

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

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

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

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

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

package/src/tools/esbuild/cache.js

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

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

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

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

@@ -36,7 +36,8 @@ class I18nInliner {
         const files = new Map();
         const pendingMaps = [];
         for (const file of options.outputFiles) {
-            if (file.type === bundler_context_1.BuildOutputFileType.Root) {
+            if (file.type === bundler_context_1.BuildOutputFileType.Root || file.type === bundler_context_1.BuildOutputFileType.ServerRoot) {
+                // Skip also the server entry-point.
                 // Skip stats and similar files.
                 continue;
             }

package/src/tools/esbuild/utils.js

@@ -30,6 +30,7 @@ const node_path_1 = require("node:path");
 const node_url_1 = require("node:url");
 const node_zlib_1 = require("node:zlib");
 const semver_1 = require("semver");
+const schema_1 = require("../../builders/application/schema");
 const manifest_1 = require("../../utils/server-rendering/manifest");
 const stats_table_1 = require("../../utils/stats-table");
 const bundler_context_1 = require("./bundler-context");
@@ -47,7 +48,7 @@ function logBuildStats(metafile, outputFiles, initial, budgetFailures, colors, c
             ++unchangedCount;
             continue;
         }
-        const isPlatformServer = type === bundler_context_1.BuildOutputFileType.Server;
+        const isPlatformServer = type === bundler_context_1.BuildOutputFileType.ServerApplication || type === bundler_context_1.BuildOutputFileType.ServerRoot;
         if (isPlatformServer && !ssrOutputEnabled) {
             // Only log server build stats when SSR is enabled.
             continue;
@@ -342,7 +343,7 @@ function getSupportedNodeTargets() {
     return SUPPORTED_NODE_VERSIONS.split('||').map((v) => 'node' + (0, semver_1.coerce)(v)?.version);
 }
 async function createJsonBuildManifest(result, normalizedOptions) {
-    const { colors: color, outputOptions: { base, server, browser }, ssrOptions, } = normalizedOptions;
+    const { colors: color, outputOptions: { base, server, browser }, ssrOptions, outputMode, } = normalizedOptions;
     const { warnings, errors, prerenderedRoutes } = result;
     const manifest = {
         errors: errors.length ? await (0, esbuild_1.formatMessages)(errors, { kind: 'error', color }) : [],
@@ -350,7 +351,9 @@ async function createJsonBuildManifest(result, normalizedOptions) {
         outputPaths: {
             root: (0, node_url_1.pathToFileURL)(base),
             browser: (0, node_url_1.pathToFileURL)((0, node_path_1.join)(base, browser)),
-            server: ssrOptions ? (0, node_url_1.pathToFileURL)((0, node_path_1.join)(base, server)) : undefined,
+            server: outputMode !== schema_1.OutputMode.Static && ssrOptions
+                ? (0, node_url_1.pathToFileURL)((0, node_path_1.join)(base, server))
+                : undefined,
         },
         prerenderedRoutes,
     };
@@ -398,4 +401,5 @@ function getEntryPointName(entryPoint) {
 exports.SERVER_GENERATED_EXTERNALS = new Set([
     './polyfills.server.mjs',
     './' + manifest_1.SERVER_APP_MANIFEST_FILENAME,
+    './' + manifest_1.SERVER_APP_ENGINE_MANIFEST_FILENAME,
 ]);

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

@@ -12,7 +12,6 @@ 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");
-const COMPONENT_REGEX = /%COMP%/g;
 function createAngularAssetsMiddleware(server, assets, outputFiles, usedComponentStyles) {
     return function angularAssetsMiddleware(req, res, next) {
         if (req.url === undefined || res.writableEnded) {
@@ -76,12 +75,10 @@ function createAngularAssetsMiddleware(server, assets, outputFiles, usedComponen
                         // Shim the stylesheet if a component ID is provided
                         if (componentId.length > 0) {
                             // Validate component ID
-                            if (/[_.-A-Za-z0-9]+-c\d{9}$/.test(componentId)) {
+                            if (/^[_.\-\p{Letter}\d]+-c\d{9}$/u.test(componentId)) {
                                 (0, load_esm_1.loadEsmModule)('@angular/compiler')
                                     .then((compilerModule) => {
-                                    const encapsulatedData = compilerModule
-                                        .encapsulateStyle(new TextDecoder().decode(data))
-                                        .replaceAll(COMPONENT_REGEX, componentId);
+                                    const encapsulatedData = compilerModule.encapsulateStyle(new TextDecoder().decode(data), componentId);
                                     res.setHeader('Content-Type', 'text/css');
                                     res.setHeader('Cache-Control', 'no-cache');
                                     res.end(encapsulatedData);

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");
+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.d.ts

@@ -8,5 +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.createAngularHeadersMiddleware = 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,6 +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,36 +7,82 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createAngularSSRMiddleware = createAngularSSRMiddleware;
-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 angularSSRMiddleware(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();
             }
-            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,38 +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,
-                };
-            };
-            server.middlewares.use((0, middlewares_1.createAngularHeadersMiddleware)(server));
-            // 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));
-            };
-        },
     };
 }
 /**