@angular/build 18.0.0-next.3

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

@@ -0,0 +1,192 @@
+"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.io/license
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.prerenderPages = void 0;
+const promises_1 = require("node:fs/promises");
+const node_path_1 = require("node:path");
+const node_url_1 = require("node:url");
+const piscina_1 = __importDefault(require("piscina"));
+const bundler_context_1 = require("../../tools/esbuild/bundler-context");
+async function prerenderPages(workspaceRoot, appShellOptions = {}, prerenderOptions = {}, outputFiles, assets, document, sourcemap = false, inlineCriticalCss = false, maxThreads = 1, verbose = false) {
+    const outputFilesForWorker = {};
+    const serverBundlesSourceMaps = new Map();
+    const warnings = [];
+    const errors = [];
+    for (const { text, path, type } of outputFiles) {
+        const fileExt = (0, node_path_1.extname)(path);
+        if (type === bundler_context_1.BuildOutputFileType.Server && fileExt === '.map') {
+            serverBundlesSourceMaps.set(path.slice(0, -4), text);
+        }
+        else if (type === bundler_context_1.BuildOutputFileType.Server || // Contains the server runnable application code
+            (type === bundler_context_1.BuildOutputFileType.Browser && fileExt === '.css') // Global styles for critical CSS inlining.
+        ) {
+            outputFilesForWorker[path] = text;
+        }
+    }
+    // Inline sourcemap into JS file. This is needed to make Node.js resolve sourcemaps
+    // when using `--enable-source-maps` when using in memory files.
+    for (const [filePath, map] of serverBundlesSourceMaps) {
+        const jsContent = outputFilesForWorker[filePath];
+        if (jsContent) {
+            outputFilesForWorker[filePath] =
+                jsContent +
+                    `\n//# sourceMappingURL=` +
+                    `data:application/json;base64,${Buffer.from(map).toString('base64')}`;
+        }
+    }
+    serverBundlesSourceMaps.clear();
+    const assetsReversed = {};
+    for (const { source, destination } of assets) {
+        assetsReversed[addLeadingSlash(destination.replace(/\\/g, node_path_1.posix.sep))] = source;
+    }
+    // Get routes to prerender
+    const { routes: allRoutes, warnings: routesWarnings } = await getAllRoutes(workspaceRoot, outputFilesForWorker, assetsReversed, document, appShellOptions, prerenderOptions, sourcemap, verbose);
+    if (routesWarnings?.length) {
+        warnings.push(...routesWarnings);
+    }
+    if (allRoutes.size < 1) {
+        return {
+            errors,
+            warnings,
+            output: {},
+            prerenderedRoutes: allRoutes,
+        };
+    }
+    // Render routes
+    const { warnings: renderingWarnings, errors: renderingErrors, output, } = await renderPages(sourcemap, allRoutes, maxThreads, workspaceRoot, outputFilesForWorker, assetsReversed, inlineCriticalCss, document, appShellOptions);
+    errors.push(...renderingErrors);
+    warnings.push(...renderingWarnings);
+    return {
+        errors,
+        warnings,
+        output,
+        prerenderedRoutes: allRoutes,
+    };
+}
+exports.prerenderPages = prerenderPages;
+class RoutesSet extends Set {
+    add(value) {
+        return super.add(addLeadingSlash(value));
+    }
+}
+async function renderPages(sourcemap, allRoutes, maxThreads, workspaceRoot, outputFilesForWorker, assetFilesForWorker, inlineCriticalCss, document, appShellOptions) {
+    const output = {};
+    const warnings = [];
+    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,
+    ];
+    if (sourcemap) {
+        workerExecArgv.push('--enable-source-maps');
+    }
+    const renderWorker = new piscina_1.default({
+        filename: require.resolve('./render-worker'),
+        maxThreads: Math.min(allRoutes.size, maxThreads),
+        workerData: {
+            workspaceRoot,
+            outputFiles: outputFilesForWorker,
+            assetFiles: assetFilesForWorker,
+            inlineCriticalCss,
+            document,
+        },
+        execArgv: workerExecArgv,
+        recordTiming: false,
+    });
+    try {
+        const renderingPromises = [];
+        const appShellRoute = appShellOptions.route && addLeadingSlash(appShellOptions.route);
+        for (const route of allRoutes) {
+            const isAppShellRoute = appShellRoute === route;
+            const serverContext = isAppShellRoute ? 'app-shell' : 'ssg';
+            const render = renderWorker.run({ route, serverContext });
+            const renderResult = render.then(({ content, warnings, errors }) => {
+                if (content !== undefined) {
+                    const outPath = isAppShellRoute
+                        ? 'index.html'
+                        : node_path_1.posix.join(removeLeadingSlash(route), 'index.html');
+                    output[outPath] = content;
+                }
+                if (warnings) {
+                    warnings.push(...warnings);
+                }
+                if (errors) {
+                    errors.push(...errors);
+                }
+            });
+            renderingPromises.push(renderResult);
+        }
+        await Promise.all(renderingPromises);
+    }
+    finally {
+        void renderWorker.destroy();
+    }
+    return {
+        errors,
+        warnings,
+        output,
+    };
+}
+async function getAllRoutes(workspaceRoot, outputFilesForWorker, assetFilesForWorker, document, appShellOptions, prerenderOptions, sourcemap, verbose) {
+    const { routesFile, discoverRoutes } = prerenderOptions;
+    const routes = new RoutesSet();
+    const { route: appShellRoute } = appShellOptions;
+    if (appShellRoute !== undefined) {
+        routes.add(appShellRoute);
+    }
+    if (routesFile) {
+        const routesFromFile = (await (0, promises_1.readFile)(routesFile, 'utf8')).split(/\r?\n/);
+        for (const route of routesFromFile) {
+            routes.add(route.trim());
+        }
+    }
+    if (!discoverRoutes) {
+        return { 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,
+    ];
+    if (sourcemap) {
+        workerExecArgv.push('--enable-source-maps');
+    }
+    const renderWorker = new piscina_1.default({
+        filename: require.resolve('./routes-extractor-worker'),
+        maxThreads: 1,
+        workerData: {
+            workspaceRoot,
+            outputFiles: outputFilesForWorker,
+            assetFiles: assetFilesForWorker,
+            document,
+            verbose,
+        },
+        execArgv: workerExecArgv,
+        recordTiming: false,
+    });
+    const { routes: extractedRoutes, warnings } = await renderWorker
+        .run({})
+        .finally(() => {
+        void renderWorker.destroy();
+    });
+    for (const route of extractedRoutes) {
+        routes.add(route);
+    }
+    return { routes, warnings };
+}
+function addLeadingSlash(value) {
+    return value.charAt(0) === '/' ? value : '/' + value;
+}
+function removeLeadingSlash(value) {
+    return value.charAt(0) === '/' ? value.slice(1) : value;
+}

package/src/utils/server-rendering/render-page.d.ts

@@ -0,0 +1,26 @@
+/**
+ * @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.io/license
+ */
+import { MainServerBundleExports, RenderUtilsServerBundleExports } from './main-bundle-exports';
+export interface RenderOptions {
+    route: string;
+    serverContext: ServerContext;
+    outputFiles: Record<string, string>;
+    document: string;
+    inlineCriticalCss?: boolean;
+    loadBundle?: ((path: './main.server.mjs') => Promise<MainServerBundleExports>) & ((path: './render-utils.server.mjs') => Promise<RenderUtilsServerBundleExports>);
+}
+export interface RenderResult {
+    errors?: string[];
+    warnings?: string[];
+    content?: string;
+}
+export type ServerContext = 'app-shell' | 'ssg' | 'ssr';
+/**
+ * Renders each route in routes and writes them to <outputPath>/<route>/index.html.
+ */
+export declare function renderPage({ route, serverContext, document, inlineCriticalCss, outputFiles, loadBundle, }: RenderOptions): Promise<RenderResult>;

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

@@ -0,0 +1,110 @@
+"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.io/license
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderPage = void 0;
+const node_assert_1 = __importDefault(require("node:assert"));
+const node_path_1 = require("node:path");
+const load_esm_from_memory_1 = require("./load-esm-from-memory");
+/**
+ * Renders each route in routes and writes them to <outputPath>/<route>/index.html.
+ */
+async function renderPage({ route, serverContext, document, inlineCriticalCss, outputFiles, loadBundle = load_esm_from_memory_1.loadEsmModuleFromMemory, }) {
+    const { default: bootstrapAppFnOrModule } = await loadBundle('./main.server.mjs');
+    const { ɵSERVER_CONTEXT, renderModule, renderApplication, ɵresetCompiledComponents, ɵConsole } = await loadBundle('./render-utils.server.mjs');
+    // Need to clean up GENERATED_COMP_IDS map in `@angular/core`.
+    // Otherwise an incorrect component ID generation collision detected warning will be displayed in development.
+    // See: https://github.com/angular/angular-cli/issues/25924
+    ɵresetCompiledComponents?.();
+    const platformProviders = [
+        {
+            provide: ɵSERVER_CONTEXT,
+            useValue: serverContext,
+        },
+        {
+            provide: ɵConsole,
+            /** An Angular Console Provider that does not print a set of predefined logs. */
+            useFactory: () => {
+                class Console extends ɵConsole {
+                    ignoredLogs = new Set(['Angular is running in development mode.']);
+                    log(message) {
+                        if (!this.ignoredLogs.has(message)) {
+                            super.log(message);
+                        }
+                    }
+                }
+                return new Console();
+            },
+        },
+    ];
+    let html;
+    (0, node_assert_1.default)(bootstrapAppFnOrModule, 'The file "./main.server.mjs" does not have a default export for an AppServerModule or a bootstrapping function.');
+    if (isBootstrapFn(bootstrapAppFnOrModule)) {
+        html = await renderApplication(bootstrapAppFnOrModule, {
+            document,
+            url: route,
+            platformProviders,
+        });
+    }
+    else {
+        html = await renderModule(bootstrapAppFnOrModule, {
+            document,
+            url: route,
+            extraProviders: platformProviders,
+        });
+    }
+    if (inlineCriticalCss) {
+        const { InlineCriticalCssProcessor } = await Promise.resolve().then(() => __importStar(require('../../utils/index-file/inline-critical-css')));
+        const inlineCriticalCssProcessor = new InlineCriticalCssProcessor({
+            minify: false, // CSS has already been minified during the build.
+            readAsset: async (filePath) => {
+                filePath = (0, node_path_1.basename)(filePath);
+                const content = outputFiles[filePath];
+                if (content === undefined) {
+                    throw new Error(`Output file does not exist: ${filePath}`);
+                }
+                return content;
+            },
+        });
+        return inlineCriticalCssProcessor.process(html, { outputPath: '' });
+    }
+    return {
+        content: html,
+    };
+}
+exports.renderPage = renderPage;
+function isBootstrapFn(value) {
+    // We can differentiate between a module and a bootstrap function by reading compiler-generated `ɵmod` static property:
+    return typeof value === 'function' && !('ɵmod' in value);
+}

package/src/utils/server-rendering/render-worker.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @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.io/license
+ */
+import type { ESMInMemoryFileLoaderWorkerData } from './esm-in-memory-loader/loader-hooks';
+import { RenderResult, ServerContext } from './render-page';
+export interface RenderWorkerData extends ESMInMemoryFileLoaderWorkerData {
+    document: string;
+    inlineCriticalCss?: boolean;
+    assetFiles: Record</** Destination */ string, /** Source */ string>;
+}
+export interface RenderOptions {
+    route: string;
+    serverContext: ServerContext;
+}
+/** Renders an application based on a provided options. */
+declare function render(options: RenderOptions): Promise<RenderResult>;
+declare const _default: typeof render;
+export default _default;

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

@@ -0,0 +1,30 @@
+"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.io/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+const node_worker_threads_1 = require("node:worker_threads");
+const fetch_patch_1 = require("./fetch-patch");
+const render_page_1 = require("./render-page");
+/**
+ * This is passed as workerData when setting up the worker via the `piscina` package.
+ */
+const { outputFiles, document, inlineCriticalCss } = node_worker_threads_1.workerData;
+/** Renders an application based on a provided options. */
+function render(options) {
+    return (0, render_page_1.renderPage)({
+        ...options,
+        outputFiles,
+        document,
+        inlineCriticalCss,
+    });
+}
+function initialize() {
+    (0, fetch_patch_1.patchFetchToLoadInMemoryAssets)();
+    return render;
+}
+exports.default = initialize();

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

@@ -0,0 +1,21 @@
+/**
+ * @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.io/license
+ */
+import type { ESMInMemoryFileLoaderWorkerData } from './esm-in-memory-loader/loader-hooks';
+export interface RoutesExtractorWorkerData extends ESMInMemoryFileLoaderWorkerData {
+    document: string;
+    verbose: boolean;
+    assetFiles: Record</** Destination */ string, /** Source */ string>;
+}
+export interface RoutersExtractorWorkerResult {
+    routes: string[];
+    warnings?: string[];
+}
+/** Renders an application based on a provided options. */
+declare function extractRoutes(): Promise<RoutersExtractorWorkerResult>;
+declare const _default: typeof extractRoutes;
+export default _default;

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

@@ -0,0 +1,53 @@
+"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.io/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+const node_worker_threads_1 = require("node:worker_threads");
+const fetch_patch_1 = require("./fetch-patch");
+const load_esm_from_memory_1 = require("./load-esm-from-memory");
+/**
+ * This is passed as workerData when setting up the worker via the `piscina` package.
+ */
+const { document, verbose } = node_worker_threads_1.workerData;
+/** Renders an application based on a provided options. */
+async function extractRoutes() {
+    const { extractRoutes } = await (0, load_esm_from_memory_1.loadEsmModuleFromMemory)('./render-utils.server.mjs');
+    const { default: bootstrapAppFnOrModule } = await (0, load_esm_from_memory_1.loadEsmModuleFromMemory)('./main.server.mjs');
+    const skippedRedirects = [];
+    const skippedOthers = [];
+    const routes = [];
+    for await (const { route, success, redirect } of extractRoutes(bootstrapAppFnOrModule, document)) {
+        if (success) {
+            routes.push(route);
+            continue;
+        }
+        if (redirect) {
+            skippedRedirects.push(route);
+        }
+        else {
+            skippedOthers.push(route);
+        }
+    }
+    if (!verbose) {
+        return { routes };
+    }
+    let warnings;
+    if (skippedOthers.length) {
+        (warnings ??= []).push('The following routes were skipped from prerendering because they contain routes with dynamic parameters:\n' +
+            skippedOthers.join('\n'));
+    }
+    if (skippedRedirects.length) {
+        (warnings ??= []).push('The following routes were skipped from prerendering because they contain redirects:\n', skippedRedirects.join('\n'));
+    }
+    return { routes, warnings };
+}
+function initialize() {
+    (0, fetch_patch_1.patchFetchToLoadInMemoryAssets)();
+    return extractRoutes;
+}
+exports.default = initialize();

package/src/utils/service-worker.d.ts

@@ -0,0 +1,25 @@
+/**
+ * @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.io/license
+ */
+/// <reference types="node" />
+/// <reference types="node" />
+import type { Config, Filesystem } from '@angular/service-worker/config';
+import { promises as fsPromises } from 'node:fs';
+import { BuildOutputFile } from '../tools/esbuild/bundler-context';
+import { BuildOutputAsset } from '../tools/esbuild/bundler-execution-result';
+export declare function augmentAppWithServiceWorker(appRoot: string, workspaceRoot: string, outputPath: string, baseHref: string, ngswConfigPath?: string, inputputFileSystem?: typeof fsPromises, outputFileSystem?: typeof fsPromises): Promise<void>;
+export declare function augmentAppWithServiceWorkerEsbuild(workspaceRoot: string, configPath: string, baseHref: string, indexHtml: string | undefined, outputFiles: BuildOutputFile[], assetFiles: BuildOutputAsset[]): Promise<{
+    manifest: string;
+    assetFiles: BuildOutputAsset[];
+}>;
+export declare function augmentAppWithServiceWorkerCore(config: Config, serviceWorkerFilesystem: Filesystem, baseHref: string): Promise<{
+    manifest: string;
+    assetFiles: {
+        source: string;
+        destination: string;
+    }[];
+}>;