@nx/angular 21.1.1 → 21.2.0-beta.1

package/src/generators/setup-mf/lib/update-tsconfig.js

@@ -2,16 +2,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.updateTsConfig = updateTsConfig;
 const devkit_1 = require("@nx/devkit");
-function updateTsConfig(tree, schema) {
-    const { root } = (0, devkit_1.readProjectConfiguration)(tree, schema.appName);
+function updateTsConfig(tree, options) {
+    const { root } = (0, devkit_1.readProjectConfiguration)(tree, options.appName);
     (0, devkit_1.updateJson)(tree, (0, devkit_1.joinPathFragments)(root, `tsconfig.app.json`), (json) => {
         json.compilerOptions ??= {};
         json.compilerOptions.target = 'ES2020';
-        if (schema.mfType === 'remote') {
+        if (options.mfType === 'remote') {
             json.files ??= [];
-            json.files.push(schema.standalone
+            json.files.push(options.standalone
                 ? 'src/app/remote-entry/entry.routes.ts'
-                : 'src/app/remote-entry/entry.module.ts');
+                : `src/app/remote-entry/${options.entryModuleFileName}.ts`);
         }
         return json;
     });

package/src/generators/setup-mf/schema.d.ts

@@ -1,3 +1,5 @@
+import type { ComponentMetadata } from '../utils/app-components-info';
+
 type FederationType = 'static' | 'dynamic';
 
 export interface Schema {
@@ -21,4 +23,9 @@ export interface Schema {
 export interface NormalizedOptions extends Schema {
   federationType: FederationType;
   prefix: string | undefined;
+  componentType: string;
+  componentFileSuffix: string;
+  entryModuleFileName: string;
+  appComponentInfo: ComponentMetadata;
+  nxWelcomeComponentInfo: ComponentMetadata;
 }

package/src/generators/setup-mf/setup-mf.d.ts

@@ -1,4 +1,4 @@
-import { type Tree } from '@nx/devkit';
+import { type GeneratorCallback, type Tree } from '@nx/devkit';
 import type { Schema } from './schema';
-export declare function setupMf(tree: Tree, rawOptions: Schema): Promise<() => void>;
+export declare function setupMf(tree: Tree, rawOptions: Schema): Promise<GeneratorCallback>;
 export default setupMf;

package/src/generators/setup-mf/setup-mf.js

@@ -3,11 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.setupMf = setupMf;
 const devkit_1 = require("@nx/devkit");
 const versions_1 = require("../../utils/versions");
+const version_utils_1 = require("../utils/version-utils");
 const lib_1 = require("./lib");
 async function setupMf(tree, rawOptions) {
     const options = (0, lib_1.normalizeOptions)(tree, rawOptions);
     const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.appName);
-    let installTask = () => { };
+    const tasks = [];
     if (options.mfType === 'remote') {
         (0, lib_1.addRemoteToHost)(tree, {
             appName: options.appName,
@@ -19,13 +20,13 @@ async function setupMf(tree, rawOptions) {
         (0, lib_1.removeDeadCodeFromRemote)(tree, options);
         (0, lib_1.setupTspathForRemote)(tree, options);
         if (!options.skipPackageJson) {
-            installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {
+            tasks.push((0, devkit_1.addDependenciesToPackageJson)(tree, {
                 '@module-federation/enhanced': versions_1.moduleFederationEnhancedVersion,
             }, {
                 '@nx/web': versions_1.nxVersion,
                 '@nx/webpack': versions_1.nxVersion,
                 '@nx/module-federation': versions_1.nxVersion,
-            });
+            }));
         }
     }
     const remotesWithPorts = (0, lib_1.getRemotesWithPorts)(tree, options);
@@ -45,11 +46,11 @@ async function setupMf(tree, rawOptions) {
             });
         }
         if (!options.skipPackageJson) {
-            installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, {
+            tasks.push((0, devkit_1.addDependenciesToPackageJson)(tree, {}, {
                 '@nx/webpack': versions_1.nxVersion,
                 '@module-federation/enhanced': versions_1.moduleFederationEnhancedVersion,
                 '@nx/module-federation': versions_1.nxVersion,
-            });
+            }));
         }
     }
     (0, lib_1.fixBootstrap)(tree, projectConfig.root, options);
@@ -64,10 +65,19 @@ async function setupMf(tree, rawOptions) {
     if (!options.skipE2E) {
         (0, lib_1.addCypressOnErrorWorkaround)(tree, options);
     }
+    if (!options.skipPackageJson) {
+        const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
+        if (angularMajorVersion >= 20) {
+            const angularDevkitVersion = (0, version_utils_1.getInstalledAngularDevkitVersion)(tree) ??
+                (0, version_utils_1.versions)(tree).angularDevkitVersion;
+            // the executors used by MF require @angular-devkit/build-angular
+            tasks.push((0, devkit_1.addDependenciesToPackageJson)(tree, {}, { '@angular-devkit/build-angular': angularDevkitVersion }, undefined, true));
+        }
+    }
     // format files
     if (!options.skipFormat) {
         await (0, devkit_1.formatFiles)(tree);
     }
-    return installTask;
+    return (0, devkit_1.runTasksInSerial)(...tasks);
 }
 exports.default = setupMf;

package/src/generators/setup-ssr/files/v20+/application-builder/ngmodule-src/__main__

@@ -0,0 +1 @@
+export { <%= rootModuleClassName %> as default } from './app/<%= rootModuleFileName.slice(0, -3) %>';

package/src/generators/setup-ssr/files/v20+/application-builder/ngmodule-src/app/__rootModuleFileName__

@@ -0,0 +1,12 @@
+import { NgModule } from '@angular/core';
+import { provideServerRendering, withRoutes } from '@angular/ssr';
+import { <%= appSymbolName %> } from './<%= appFileName %>';
+import { AppModule } from './app<%= moduleTypeSeparator %>module';
+import { serverRoutes } from './app.routes.server';
+
+@NgModule({
+  imports: [AppModule],
+  providers: [provideServerRendering(withRoutes(serverRoutes))],
+  bootstrap: [<%= appSymbolName %>],
+})
+export class <%= rootModuleClassName %> {}

package/src/generators/setup-ssr/files/v20+/application-builder/ngmodule-src/app/app.routes.server.ts__tpl__

@@ -0,0 +1,8 @@
+import { RenderMode, ServerRoute } from '@angular/ssr';
+
+export const serverRoutes: ServerRoute[] = [
+  {
+    path: '**',
+    renderMode: RenderMode.Prerender
+  }
+];

package/src/generators/setup-ssr/files/v20+/application-builder/server/__serverFileName__

@@ -0,0 +1,66 @@
+import {
+  AngularNodeAppEngine,
+  createNodeRequestHandler,
+  isMainModule,
+  writeResponseToNodeResponse,
+} from '@angular/ssr/node';
+import express from 'express';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const serverDistFolder = dirname(fileURLToPath(import.meta.url));
+const browserDistFolder = resolve(serverDistFolder, '../<%= browserDistDirectory %>');
+
+const app = express();
+const angularApp = new AngularNodeAppEngine();
+
+/**
+ * Example Express Rest API endpoints can be defined here.
+ * Uncomment and define endpoints as necessary.
+ *
+ * Example:
+ * ```ts
+ * app.get('/api/**', (req, res) => {
+ *   // Handle API request
+ * });
+ * ```
+ */
+
+/**
+ * Serve static files from /<%= browserDistDirectory %>
+ */
+app.use(
+  express.static(browserDistFolder, {
+    maxAge: '1y',
+    index: false,
+    redirect: false,
+  })
+);
+
+/**
+ * Handle all other requests by rendering the Angular application.
+ */
+app.use('/**', (req, res, next) => {
+  angularApp
+    .handle(req)
+    .then((response) =>
+      response ? writeResponseToNodeResponse(response, res) : next()
+    )
+    .catch(next);
+});
+
+/**
+ * Start the server if this module is the main entry point.
+ * The server listens on the port defined by the `PORT` environment variable, or defaults to <%= serverPort %>.
+ */
+if (isMainModule(import.meta.url)) {
+  const port = process.env['PORT'] || <%= serverPort %>;
+  app.listen(port, () => {
+    console.log(`Node Express server listening on http://localhost:${port}`);
+  });
+}
+
+/**
+ * Request handler used by the Angular CLI (for dev-server and during build) or Firebase Cloud Functions.
+ */
+export const reqHandler = createNodeRequestHandler(app);

package/src/generators/setup-ssr/files/v20+/application-builder/standalone-src/__main__

@@ -0,0 +1,7 @@
+import { bootstrapApplication } from '@angular/platform-browser';
+import { <%= appSymbolName %> } from './app/<%= appFileName %>';
+import { config } from './app/app.config.server';
+
+const bootstrap = () => bootstrapApplication(<%= appSymbolName %>, config);
+
+export default bootstrap;

package/src/generators/setup-ssr/files/v20+/application-builder/standalone-src/app/app.config.server.ts__tpl__

@@ -0,0 +1,12 @@
+import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
+import { provideServerRendering, withRoutes } from '@angular/ssr';
+import { appConfig } from './app.config';
+import { serverRoutes } from './app.routes.server';
+
+const serverConfig: ApplicationConfig = {
+  providers: [
+    provideServerRendering(withRoutes(serverRoutes))
+  ]
+};
+
+export const config = mergeApplicationConfig(appConfig, serverConfig);

package/src/generators/setup-ssr/files/v20+/application-builder/standalone-src/app/app.routes.server.ts__tpl__

@@ -0,0 +1,8 @@
+import { RenderMode, ServerRoute } from '@angular/ssr';
+
+export const serverRoutes: ServerRoute[] = [
+  {
+    path: '**',
+    renderMode: RenderMode.Prerender
+  }
+];

package/src/generators/setup-ssr/files/v20+/server-builder/ngmodule-src/__main__

@@ -0,0 +1 @@
+export { <%= rootModuleClassName %> as default } from './app/<%= rootModuleFileName.slice(0, -3) %>';

package/src/generators/setup-ssr/files/v20+/server-builder/ngmodule-src/app/__rootModuleFileName__

@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+import { ServerModule } from '@angular/platform-server';
+
+import { AppModule } from './app<%= moduleTypeSeparator %>module';
+import { <%= appSymbolName %> } from './<%= appFileName %>';
+
+@NgModule({
+  imports: [
+    AppModule,
+    ServerModule,
+  ],
+  bootstrap: [<%= appSymbolName %>],
+})
+export class <%= rootModuleClassName %> {}

package/src/generators/setup-ssr/files/v20+/server-builder/root/tsconfig.server.json.template

@@ -0,0 +1,18 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "./tsconfig.app.json",
+  "compilerOptions": {
+    "outDir": "<%= rootOffset %>out-tsc/server",
+    "module": "commonjs",
+    "moduleResolution": "node10",
+    "types": [
+      "node"<% if (hasLocalizePackage) { %>,
+      "@angular/localize"<% } %>
+    ]
+  },
+  "files": [
+    "src/<%= main %>",
+    "src/server.ts"
+  ]
+}

package/src/generators/setup-ssr/files/v20+/server-builder/server/__serverFileName__

@@ -0,0 +1,69 @@
+import 'zone.js/node';
+
+import { APP_BASE_HREF } from '@angular/common';
+import { CommonEngine } from '@angular/ssr/node';
+import * as express from 'express';
+import { existsSync } from 'node:fs';
+import { join } from 'node:path';
+import <% if (standalone) { %>bootstrap<% } else { %><%= rootModuleClassName %><% } %> from './<%= main.slice(0, -3) %>';
+
+// The Express app is exported so that it can be used by serverless Functions.
+export function app(): express.Express {
+  const server = express();
+  const distFolder = join(process.cwd(), '<%= browserDistDirectory %>');
+  const indexHtml = existsSync(join(distFolder, 'index.original.html'))
+    ? join(distFolder, 'index.original.html')
+    : join(distFolder, 'index.html');
+
+  const commonEngine = new CommonEngine();
+
+  server.set('view engine', 'html');
+  server.set('views', distFolder);
+
+  // Example Express Rest API endpoints
+  // server.get('/api/**', (req, res) => { });
+  // Serve static files from /browser
+  server.get('*.*', express.static(distFolder, {
+    maxAge: '1y'
+  }));
+
+  // All regular routes use the Angular engine
+  server.get('*', (req, res, next) => {
+    const { protocol, originalUrl, baseUrl, headers } = req;
+
+    commonEngine
+      .render({
+        bootstrap<% if (!standalone) { %>: <%= rootModuleClassName %><% } %>,
+        documentFilePath: indexHtml,
+        url: `${protocol}://${headers.host}${originalUrl}`,
+        publicPath: distFolder,
+        providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }],
+      })
+      .then((html) => res.send(html))
+      .catch((err) => next(err));
+  });
+
+  return server;
+}
+
+function run(): void {
+  const port = process.env['PORT'] || <%= serverPort %>;
+
+  // Start up the Node server
+  const server = app();
+  server.listen(port, () => {
+    console.log(`Node Express server listening on http://localhost:${port}`);
+  });
+}
+
+// Webpack will replace 'require' with '__webpack_require__'
+// '__non_webpack_require__' is a proxy to Node 'require'
+// The below code is to ensure that the server is run only when not requiring the bundle.
+declare const __non_webpack_require__: NodeRequire;
+const mainModule = __non_webpack_require__.main;
+const moduleFilename = mainModule && mainModule.filename || '';
+if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
+  run();
+}
+
+export default <% if (standalone) { %>bootstrap<% } else { %><%= rootModuleClassName %><% } %>;

package/src/generators/setup-ssr/files/v20+/server-builder/standalone-src/__main__

@@ -0,0 +1,7 @@
+import { bootstrapApplication } from '@angular/platform-browser';
+import { <%= appSymbolName %> } from './app/<%= appFileName %>';
+import { config } from './app/app.config.server';
+
+const bootstrap = () => bootstrapApplication(<%= appSymbolName %>, config);
+
+export default bootstrap;

package/src/generators/setup-ssr/files/v20+/server-builder/standalone-src/app/app.config.server.ts.template

@@ -0,0 +1,11 @@
+import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
+import { provideServerRendering } from '@angular/ssr';
+import { appConfig } from './app.config';
+
+const serverConfig: ApplicationConfig = {
+  providers: [
+    provideServerRendering()
+  ]
+};
+
+export const config = mergeApplicationConfig(appConfig, serverConfig);

package/src/generators/setup-ssr/lib/add-dependencies.js

@@ -2,24 +2,27 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.addDependencies = addDependencies;
 const devkit_1 = require("@nx/devkit");
-const semver_1 = require("semver");
 const version_utils_1 = require("../../utils/version-utils");
 function addDependencies(tree, isUsingApplicationBuilder) {
     const pkgVersions = (0, version_utils_1.versions)(tree);
-    const { version: angularVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
     const dependencies = {
-        '@angular/platform-server': (0, version_utils_1.getInstalledPackageVersionInfo)(tree, '@angular/platform-server')
-            ?.version ?? pkgVersions.angularVersion,
+        '@angular/platform-server': (0, version_utils_1.getInstalledPackageVersion)(tree, '@angular/platform-server') ??
+            pkgVersions.angularVersion,
         express: pkgVersions.expressVersion,
     };
     const devDependencies = {
         '@types/express': pkgVersions.typesExpressVersion,
     };
-    dependencies['@angular/ssr'] =
-        (0, version_utils_1.getInstalledPackageVersionInfo)(tree, '@angular-devkit/build-angular')
-            ?.version ?? pkgVersions.angularDevkitVersion;
-    if (!isUsingApplicationBuilder && (0, semver_1.gte)(angularVersion, '17.1.0')) {
+    const angularDevkitVersion = (0, version_utils_1.getInstalledAngularDevkitVersion)(tree) ?? pkgVersions.angularDevkitVersion;
+    dependencies['@angular/ssr'] = angularDevkitVersion;
+    if (!isUsingApplicationBuilder) {
         devDependencies['browser-sync'] = pkgVersions.browserSyncVersion;
     }
+    else {
+        const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
+        if (angularMajorVersion >= 20) {
+            dependencies['@angular-devkit/build-angular'] = angularDevkitVersion;
+        }
+    }
     (0, devkit_1.addDependenciesToPackageJson)(tree, dependencies, devDependencies);
 }

package/src/generators/setup-ssr/lib/add-hydration.js

@@ -14,9 +14,16 @@ function addHydration(tree, options) {
         tsModule = (0, ensure_typescript_1.ensureTypescript)();
         tsquery = require('@phenomnomnominal/tsquery').tsquery;
     }
-    const pathToClientConfigFile = options.standalone
-        ? (0, devkit_1.joinPathFragments)(projectConfig.sourceRoot, 'app/app.config.ts')
-        : (0, devkit_1.joinPathFragments)(projectConfig.sourceRoot, 'app/app.module.ts');
+    let pathToClientConfigFile;
+    if (options.standalone) {
+        pathToClientConfigFile = (0, devkit_1.joinPathFragments)(projectConfig.sourceRoot, 'app/app.config.ts');
+    }
+    else {
+        pathToClientConfigFile = (0, devkit_1.joinPathFragments)(projectConfig.sourceRoot, 'app/app.module.ts');
+        if (!tree.exists(pathToClientConfigFile)) {
+            pathToClientConfigFile = (0, devkit_1.joinPathFragments)(projectConfig.sourceRoot, 'app/app-module.ts');
+        }
+    }
     const sourceText = tree.read(pathToClientConfigFile, 'utf-8');
     let sourceFile = tsModule.createSourceFile(pathToClientConfigFile, sourceText, tsModule.ScriptTarget.Latest, true);
     const provideClientHydrationCallExpression = tsquery(sourceFile, 'ObjectLiteralExpression PropertyAssignment:has(Identifier[name=providers]) ArrayLiteralExpression CallExpression:has(Identifier[name=provideClientHydration])')[0];

package/src/generators/setup-ssr/lib/add-server-file.js

@@ -14,8 +14,13 @@ function addServerFile(tree, options) {
     const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
     const baseFilesPath = (0, path_1.join)(__dirname, '..', 'files');
     let pathToFiles;
-    if (angularMajorVersion >= 19) {
-        pathToFiles = (0, path_1.join)(baseFilesPath, 'v19+', options.isUsingApplicationBuilder
+    if (angularMajorVersion >= 20) {
+        pathToFiles = (0, path_1.join)(baseFilesPath, 'v20+', options.isUsingApplicationBuilder
+            ? 'application-builder'
+            : 'server-builder', 'server');
+    }
+    else if (angularMajorVersion === 19) {
+        pathToFiles = (0, path_1.join)(baseFilesPath, 'v19', options.isUsingApplicationBuilder
             ? 'application-builder' +
                 (options.serverRouting ? '' : '-common-engine')
             : 'server-builder', 'server');

package/src/generators/setup-ssr/lib/generate-files.js

@@ -3,8 +3,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.generateSSRFiles = generateSSRFiles;
 const devkit_1 = require("@nx/devkit");
 const path_1 = require("path");
-const version_utils_1 = require("../../utils/version-utils");
 const semver_1 = require("semver");
+const app_components_info_1 = require("../../utils/app-components-info");
+const artifact_types_1 = require("../../utils/artifact-types");
+const version_utils_1 = require("../../utils/version-utils");
 function generateSSRFiles(tree, options) {
     const project = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     if (project.targets.server ||
@@ -16,8 +18,13 @@ function generateSSRFiles(tree, options) {
     const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
     const baseFilesPath = (0, path_1.join)(__dirname, '..', 'files');
     let pathToFiles;
-    if (angularMajorVersion >= 19) {
-        pathToFiles = (0, path_1.join)(baseFilesPath, 'v19+', options.isUsingApplicationBuilder
+    if (angularMajorVersion >= 20) {
+        pathToFiles = (0, path_1.join)(baseFilesPath, 'v20+', options.isUsingApplicationBuilder
+            ? 'application-builder'
+            : 'server-builder', options.standalone ? 'standalone-src' : 'ngmodule-src');
+    }
+    else if (angularMajorVersion === 19) {
+        pathToFiles = (0, path_1.join)(baseFilesPath, 'v19', options.isUsingApplicationBuilder
             ? 'application-builder'
             : 'server-builder', options.standalone ? 'standalone-src' : 'ngmodule-src');
     }
@@ -29,14 +36,20 @@ function generateSSRFiles(tree, options) {
     const cleanedSsrVersion = ssrVersion
         ? (0, semver_1.clean)(ssrVersion) ?? (0, semver_1.coerce)(ssrVersion).version
         : null;
+    const componentType = (0, artifact_types_1.getComponentType)(tree);
+    const appComponentInfo = (0, app_components_info_1.getAppComponentInfo)(tree, componentType ? `.${componentType}` : '', project);
+    const moduleTypeSeparator = (0, artifact_types_1.getModuleTypeSeparator)(tree);
     (0, devkit_1.generateFiles)(tree, pathToFiles, sourceRoot, {
         ...options,
         provideServerRoutingFn: !cleanedSsrVersion || (0, semver_1.gte)(cleanedSsrVersion, '19.2.0')
             ? 'provideServerRouting'
             : 'provideServerRoutesConfig',
+        appFileName: appComponentInfo.extensionlessFileName,
+        appSymbolName: appComponentInfo.symbolName,
+        moduleTypeSeparator,
         tpl: '',
     });
-    if (angularMajorVersion >= 19 && !options.serverRouting) {
+    if (angularMajorVersion === 19 && !options.serverRouting) {
         tree.delete((0, devkit_1.joinPathFragments)(sourceRoot, 'app/app.routes.server.ts'));
     }
 }

package/src/generators/setup-ssr/lib/generate-server-ts-config.js

@@ -9,6 +9,14 @@ function setServerTsConfigOptionsForApplicationBuilder(tree, options) {
     const { targets } = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     const tsConfigPath = targets.build.options.tsConfig;
     (0, devkit_1.updateJson)(tree, tsConfigPath, (json) => {
+        json.compilerOptions ??= {};
+        const types = new Set(json.compilerOptions.types ?? []);
+        types.add('node');
+        json.compilerOptions.types = Array.from(types);
+        if (json.include?.includes('src/**/*.ts')) {
+            // server file is already included, no need to add it
+            return json;
+        }
         const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
         const files = new Set(json.files ?? []);
         files.add((0, devkit_1.joinPathFragments)('src', options.main));
@@ -19,10 +27,6 @@ function setServerTsConfigOptionsForApplicationBuilder(tree, options) {
             files.add((0, devkit_1.joinPathFragments)(options.serverFileName));
         }
         json.files = Array.from(files);
-        json.compilerOptions ??= {};
-        const types = new Set(json.compilerOptions.types ?? []);
-        types.add('node');
-        json.compilerOptions.types = Array.from(types);
         return json;
     });
 }
@@ -34,8 +38,11 @@ function generateTsConfigServerJsonForBrowserBuilder(tree, options) {
         !!packageJson.devDependencies?.['@angular/localize'];
     const baseFilesPath = (0, path_1.join)(__dirname, '..', 'files');
     let pathToFiles;
-    if (angularMajorVersion >= 19) {
-        pathToFiles = (0, path_1.join)(baseFilesPath, 'v19+', 'server-builder', 'root');
+    if (angularMajorVersion >= 20) {
+        pathToFiles = (0, path_1.join)(baseFilesPath, 'v20+', 'server-builder', 'root');
+    }
+    else if (angularMajorVersion === 19) {
+        pathToFiles = (0, path_1.join)(baseFilesPath, 'v19', 'server-builder', 'root');
     }
     else {
         pathToFiles = (0, path_1.join)(baseFilesPath, 'pre-v19', 'root');
@@ -46,4 +53,23 @@ function generateTsConfigServerJsonForBrowserBuilder(tree, options) {
         hasLocalizePackage,
         tpl: '',
     });
+    (0, devkit_1.updateJson)(tree, (0, devkit_1.joinPathFragments)(project.root, 'tsconfig.json'), (json) => {
+        json.references ??= [];
+        json.references.push({
+            path: (0, devkit_1.joinPathFragments)(project.root, 'tsconfig.server.json'),
+        });
+        return json;
+    });
+    if (angularMajorVersion >= 20) {
+        (0, devkit_1.updateJson)(tree, options.buildTargetTsConfigPath, (json) => {
+            const exclude = new Set(json.exclude ?? []);
+            exclude.add(`src/${options.main}`);
+            exclude.add(`src/${options.serverFileName}`);
+            if (options.standalone) {
+                exclude.add('src/app/app.config.server.ts');
+            }
+            json.exclude = Array.from(exclude);
+            return json;
+        });
+    }
 }

package/src/generators/setup-ssr/lib/normalize-options.js

@@ -6,13 +6,13 @@ const prompt_1 = require("@nx/devkit/src/generators/prompt");
 const ast_utils_1 = require("../../../utils/nx-devkit/ast-utils");
 const version_utils_1 = require("../../utils/version-utils");
 async function normalizeOptions(tree, options) {
-    const { targets } = (0, devkit_1.readProjectConfiguration)(tree, options.project);
+    const { targets, root } = (0, devkit_1.readProjectConfiguration)(tree, options.project);
     const isUsingApplicationBuilder = targets.build.executor === '@angular-devkit/build-angular:application' ||
         targets.build.executor === '@angular/build:application' ||
         targets.build.executor === '@nx/angular:application';
     if (options.serverRouting === undefined && isUsingApplicationBuilder) {
         const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
-        if (angularMajorVersion >= 19) {
+        if (angularMajorVersion === 19) {
             options.serverRouting = await (0, prompt_1.promptWhenInteractive)({
                 type: 'confirm',
                 name: 'serverRouting',
@@ -21,7 +21,7 @@ async function normalizeOptions(tree, options) {
             }, { serverRouting: false }).then(({ serverRouting }) => serverRouting);
         }
         else {
-            options.serverRouting = false;
+            options.serverRouting = angularMajorVersion >= 20;
         }
     }
     else if (options.serverRouting !== undefined &&
@@ -42,5 +42,7 @@ async function normalizeOptions(tree, options) {
         hydration: options.hydration ?? true,
         serverRouting: options.serverRouting,
         isUsingApplicationBuilder,
+        buildTargetTsConfigPath: targets.build.options?.tsConfig ??
+            (0, devkit_1.joinPathFragments)(root, 'tsconfig.app.json'),
     };
 }

package/src/generators/setup-ssr/lib/update-project-config.js

@@ -21,6 +21,11 @@ function updateProjectConfigForApplicationBuilder(tree, options) {
         }
         else {
             outputPath = outputPath.base;
+            if (buildTarget.outputs && buildTarget.outputs.length > 0) {
+                buildTarget.outputs = buildTarget.outputs.map((output) => output === '{options.outputPath.base}'
+                    ? '{options.outputPath}'
+                    : output);
+            }
         }
     }
     const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);

package/src/generators/setup-ssr/lib/validate-options.js

@@ -8,8 +8,8 @@ function validateOptions(tree, options) {
     validateProject(tree, options.project);
     validateBuildTarget(tree, options.project);
     const { major: angularMajorVersion, version: angularVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
-    if (angularMajorVersion < 19 && options.serverRouting) {
-        throw new Error(`The "serverRouting" option is only supported in Angular versions >= 19.0.0. You are using Angular ${angularVersion}.`);
+    if (angularMajorVersion !== 19 && options.serverRouting !== undefined) {
+        throw new Error(`The "serverRouting" option is only supported in Angular versions 19.x.x. You are using Angular ${angularVersion}.`);
     }
 }
 function validateProject(tree, project) {

package/src/generators/setup-ssr/schema.d.ts

@@ -15,4 +15,5 @@ export interface Schema {
 
 export interface NormalizedGeneratorOptions extends Schema {
   isUsingApplicationBuilder: boolean;
+  buildTargetTsConfigPath: string;
 }

package/src/generators/setup-ssr/schema.json

@@ -53,7 +53,7 @@
       "default": true
     },
     "serverRouting": {
-      "description": "Creates a server application using the Server Routing and App Engine APIs (Developer Preview). _Note: this is only supported in Angular versions >= 19.0.0_.",
+      "description": "Creates a server application using the Server Routing and App Engine APIs for application using the `application` builder (Developer Preview). _Note: this is only supported in Angular versions 19.x.x_. From Angular 20 onwards, SSR will always enable server routing when using the `application` builder.",
       "type": "boolean"
     },
     "skipFormat": {