@nx/angular 17.1.0-beta.0 → 17.1.0-beta.3

package/src/generators/remote/files/common/v17+/src/main.server.ts__tmpl__

@@ -0,0 +1,74 @@
+import 'zone.js/node';
+
+import { APP_BASE_HREF } from '@angular/common';
+import { CommonEngine } from '@angular/ssr';
+import * as express from 'express';
+import * as cors from 'cors';
+import { existsSync } from 'node:fs';
+import { join } from 'node:path';
+import<% if(standalone) { %> bootstrap <% } else { %> { AppServerModule } <% } %>from './bootstrap.server';
+
+// The Express app is exported so that it can be used by serverless Functions.
+export function app(): express.Express {
+  const server = express();
+  const browserBundles = join(process.cwd(), '<%= browserBundleOutput %>');
+  const serverBundles = join(process.cwd(), '<%= serverBundleOutput %>');
+  const indexHtml = existsSync(join(browserBundles, 'index.original.html'))
+    ? join(browserBundles, 'index.original.html')
+    : join(browserBundles, 'index.html');
+
+  server.use(cors());
+
+  const commonEngine = new CommonEngine();
+
+  server.set('view engine', 'html');
+  server.set('views', browserBundles);
+
+
+  // Example Express Rest API endpoints
+  // server.get('/api/**', (req, res) => { });
+  // Serve static files from /browser
+  server.use('/', express.static(browserBundles, { maxAge: '1y' }));
+  // Serve static files from /server
+  server.use('/server', express.static(serverBundles, { 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) { %>: AppServerModule<% } %>,
+        documentFilePath: indexHtml,
+        url: `${protocol}://${headers.host}${originalUrl}`,
+        publicPath: browserBundles,
+        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'] || 4000;
+
+  // Start up the Node server
+  const server = app();
+  server.listen(port, () => {
+    console.log(`Node Express server listening on http://localhost:${port}`);
+
+    /**
+     * DO NOT REMOVE IF USING @nx/angular:module-federation-dev-ssr executor
+     * to serve your Host application with this Remote application.
+     * This message allows Nx to determine when the Remote is ready to be
+     * consumed by the Host.
+     */
+    process.send && process.send('nx.server.ready');
+  });
+}
+
+run();
+
+export default <% if (standalone) { %>bootstrap<% } else { %>AppServerModule<% } %>;

package/src/generators/remote/lib/index.d.ts

@@ -1,2 +1,2 @@
 export * from './find-next-available-port';
-export * from './add-ssr';
+export * from './update-ssr-setup';

package/src/generators/remote/lib/index.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./find-next-available-port"), exports);
-tslib_1.__exportStar(require("./add-ssr"), exports);
+tslib_1.__exportStar(require("./update-ssr-setup"), exports);

package/src/generators/remote/lib/{add-ssr.d.ts → update-ssr-setup.d.ts}

@@ -1,5 +1,5 @@
 import type { Tree } from '@nx/devkit';
-export declare function addSsr(tree: Tree, { appName, port, standalone, typescriptConfiguration, }: {
+export declare function updateSsrSetup(tree: Tree, { appName, port, standalone, typescriptConfiguration, }: {
     appName: string;
     port: number;
     standalone: boolean;

package/src/generators/remote/lib/{add-ssr.js → update-ssr-setup.js}

@@ -1,20 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addSsr = void 0;
+exports.updateSsrSetup = void 0;
 const devkit_1 = require("@nx/devkit");
-const setup_ssr_1 = require("../../setup-ssr/setup-ssr");
+const path_1 = require("path");
 const versions_1 = require("../../../utils/versions");
-async function addSsr(tree, { appName, port, standalone, typescriptConfiguration, }) {
+const version_utils_1 = require("../../utils/version-utils");
+async function updateSsrSetup(tree, { appName, port, standalone, typescriptConfiguration, }) {
     let project = (0, devkit_1.readProjectConfiguration)(tree, appName);
-    await (0, setup_ssr_1.default)(tree, {
-        project: appName,
-        standalone,
-    });
     tree.rename((0, devkit_1.joinPathFragments)(project.sourceRoot, 'main.server.ts'), (0, devkit_1.joinPathFragments)(project.sourceRoot, 'bootstrap.server.ts'));
     tree.write((0, devkit_1.joinPathFragments)(project.root, 'server.ts'), "import('./src/main.server');");
-    const browserBundleOutput = (0, devkit_1.joinPathFragments)(project.targets.build.options.outputPath, 'browser');
-    const serverBundleOutput = (0, devkit_1.joinPathFragments)(project.targets.build.options.outputPath, 'server');
-    (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(__dirname, `../files/common`), project.root, {
+    const browserBundleOutput = project.targets.build.options.outputPath;
+    const serverBundleOutput = project.targets.build.options.outputPath.replace(/\/browser$/, '/server');
+    const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
+    (0, devkit_1.generateFiles)(tree, (0, path_1.join)(__dirname, '../files/common', angularMajorVersion >= 17 ? 'v17+' : 'pre-v17'), project.root, {
         appName,
         browserBundleOutput,
         serverBundleOutput,
@@ -52,12 +50,10 @@ async function addSsr(tree, { appName, port, standalone, typescriptConfiguration
     (0, devkit_1.updateProjectConfiguration)(tree, appName, project);
     const installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {
         cors: versions_1.corsVersion,
-        express: versions_1.expressVersion,
         '@module-federation/node': versions_1.moduleFederationNodeVersion,
     }, {
         '@types/cors': versions_1.typesCorsVersion,
-        '@types/express': versions_1.typesExpressVersion,
     });
     return installTask;
 }
-exports.addSsr = addSsr;
+exports.updateSsrSetup = updateSsrSetup;

package/src/generators/remote/remote.js

@@ -3,11 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.remoteInternal = exports.remote = void 0;
 const devkit_1 = require("@nx/devkit");
 const project_name_and_root_utils_1 = require("@nx/devkit/src/generators/project-name-and-root-utils");
-const semver_1 = require("semver");
 const test_runners_1 = require("../../utils/test-runners");
 const application_1 = require("../application/application");
 const setup_mf_1 = require("../setup-mf/setup-mf");
-const version_utils_1 = require("../utils/version-utils");
 const lib_1 = require("./lib");
 const versions_1 = require("@nx/js/src/utils/versions");
 async function remote(tree, options) {
@@ -18,12 +16,8 @@ async function remote(tree, options) {
 }
 exports.remote = remote;
 async function remoteInternal(tree, schema) {
-    const installedAngularVersionInfo = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
-    if ((0, semver_1.lt)(installedAngularVersionInfo.version, '14.1.0') && schema.standalone) {
-        throw new Error((0, devkit_1.stripIndents) `The "standalone" option is only supported in Angular >= 14.1.0. You are currently using ${installedAngularVersionInfo.version}.
-    You can resolve this error by removing the "standalone" option or by migrating to Angular 14.1.0.`);
-    }
     const { typescriptConfiguration = true, ...options } = schema;
+    options.standalone = options.standalone ?? true;
     const projects = (0, devkit_1.getProjects)(tree);
     if (options.host && !projects.has(options.host)) {
         throw new Error(`The name of the application to be used as the host app does not exist. (${options.host})`);
@@ -39,10 +33,11 @@ async function remoteInternal(tree, schema) {
     const port = options.port ?? (0, lib_1.findNextAvailablePort)(tree);
     const appInstallTask = await (0, application_1.applicationGenerator)(tree, {
         ...options,
-        standalone: options.standalone ?? false,
+        standalone: options.standalone,
         routing: true,
         port,
         skipFormat: true,
+        bundler: 'webpack',
     });
     const skipE2E = !options.e2eTestRunner || options.e2eTestRunner === test_runners_1.E2eTestRunner.None;
     await (0, setup_mf_1.setupMf)(tree, {
@@ -64,7 +59,7 @@ async function remoteInternal(tree, schema) {
     });
     let installTasks = [appInstallTask, installSwcHelpersTask];
     if (options.ssr) {
-        let ssrInstallTask = await (0, lib_1.addSsr)(tree, {
+        let ssrInstallTask = await (0, lib_1.updateSsrSetup)(tree, {
             appName: remoteProjectName,
             port,
             typescriptConfiguration,

package/src/generators/remote/schema.json

@@ -158,9 +158,9 @@
       "x-priority": "internal"
     },
     "standalone": {
-      "description": "Whether to generate a remote application with standalone components. _Note: This is only supported in Angular versions >= 14.1.0_",
+      "description": "Whether to generate a remote application with standalone components.",
       "type": "boolean",
-      "default": false
+      "default": true
     },
     "ssr": {
       "description": "Whether to configure SSR for the remote application to be consumed by a host application using SSR.",

package/src/generators/scam-to-standalone/scam-to-standalone.js

@@ -3,14 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.scamToStandalone = void 0;
 const devkit_1 = require("@nx/devkit");
 const lib_1 = require("./lib");
-const version_utils_1 = require("../utils/version-utils");
-const semver_1 = require("semver");
 async function scamToStandalone(tree, { component, project: projectName, skipFormat }) {
-    const installedAngularVersionInfo = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
-    if ((0, semver_1.lt)(installedAngularVersionInfo.version, '14.1.0')) {
-        throw new Error((0, devkit_1.stripIndents) `This generator is only supported with Angular >= 14.1.0. You are currently using ${installedAngularVersionInfo.version}.
-    You can resolve this error by migrating to Angular 14.1.0.`);
-    }
     const projects = (0, devkit_1.getProjects)(tree);
     let project = (0, lib_1.getTargetProject)(projectName, projects);
     const normalizedComponentPath = (0, devkit_1.joinPathFragments)(project.root, component);

package/src/generators/scam-to-standalone/schema.json

@@ -3,7 +3,7 @@
   "$id": "GeneratorAngularScamToStandalone",
   "cli": "nx",
   "title": "Convert an Inline SCAM to Standalone Component",
-  "description": "Convert an Inline SCAM to a Standalone Component. _Note: This generator is only supported with Angular versions >= 14.1.0_.",
+  "description": "Convert an Inline SCAM to a Standalone Component.",
   "type": "object",
   "properties": {
     "component": {

package/src/generators/setup-mf/lib/add-remote-entry.js

@@ -15,17 +15,8 @@ function addRemoteEntry(tree, { appName, routing, prefix, standalone }, appRoot)
     if (standalone && routing) {
         (0, route_utils_1.addRoute)(tree, (0, devkit_1.joinPathFragments)(appRoot, 'src/app/app.routes.ts'), `{path: '', loadChildren: () => import('./remote-entry/entry.routes').then(m => m.remoteRoutes)}`);
     }
-    else {
-        if (routing) {
-            (0, route_utils_1.addRoute)(tree, (0, devkit_1.joinPathFragments)(appRoot, 'src/app/app.routes.ts'), `{path: '', loadChildren: () => import('./remote-entry/entry.module').then(m => m.RemoteEntryModule)}`);
-        }
-        tree.write(`${appRoot}/src/app/app.module.ts`, `/* 
-      * This RemoteEntryModule is imported here to allow TS to find the Module during 
-      * compilation, allowing it to be included in the built bundle. This is required 
-      * for the Module Federation Plugin to expose the Module correctly.
-      * */
-      import { RemoteEntryModule } from './remote-entry/entry.module';
-${tree.read(`${appRoot}/src/app/app.module.ts`, 'utf-8')}`);
+    else if (routing) {
+        (0, route_utils_1.addRoute)(tree, (0, devkit_1.joinPathFragments)(appRoot, 'src/app/app.routes.ts'), `{path: '', loadChildren: () => import('./remote-entry/entry.module').then(m => m.RemoteEntryModule)}`);
     }
 }
 exports.addRemoteEntry = addRemoteEntry;

package/src/generators/setup-mf/lib/fix-bootstrap.js

@@ -2,13 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.fixBootstrap = void 0;
 const devkit_1 = require("@nx/devkit");
-const version_utils_1 = require("../../utils/version-utils");
 function fixBootstrap(tree, appRoot, options) {
     const mainFilePath = (0, devkit_1.joinPathFragments)(appRoot, 'src/main.ts');
     const bootstrapCode = tree.read(mainFilePath, 'utf-8');
-    const installedAngularMajor = (0, version_utils_1.getInstalledAngularMajorVersion)(tree);
     if (options.standalone && options.mfType === 'remote') {
-        tree.write(`${appRoot}/src/bootstrap.ts`, standaloneBootstrapCode(installedAngularMajor === 14));
+        tree.write(`${appRoot}/src/bootstrap.ts`, standaloneBootstrapCode());
     }
     else {
         tree.write((0, devkit_1.joinPathFragments)(appRoot, 'src/bootstrap.ts'), bootstrapCode);
@@ -25,17 +23,10 @@ function fixBootstrap(tree, appRoot, options) {
         : bootstrapImportCode);
 }
 exports.fixBootstrap = fixBootstrap;
-const standaloneBootstrapCode = (includeEnvironments = false) => `import {bootstrapApplication} from "@angular/platform-browser";
+const standaloneBootstrapCode = () => `import {bootstrapApplication} from "@angular/platform-browser";
 import {appConfig} from './app/app.config';
 import {RemoteEntryComponent} from './app/remote-entry/entry.component';
-${includeEnvironments
-    ? `import {enableProdMode} from '@angular/core';
-import {environment} from './environments/environment';
-if(environment.production) {
-  enableProdMode();
-}
-`
-    : ``}
+
 bootstrapApplication(RemoteEntryComponent, appConfig).catch((err) =>
   console.error(err)
 );`;

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

@@ -6,7 +6,7 @@ export * from './fix-bootstrap';
 export * from './generate-config';
 export * from './get-remotes-with-ports';
 export * from './normalize-options';
-export * from './set-tsconfig-target';
+export * from './update-tsconfig';
 export * from './setup-host-if-dynamic';
 export * from './setup-serve-target';
 export * from './update-host-app-routes';

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

@@ -9,7 +9,7 @@ tslib_1.__exportStar(require("./fix-bootstrap"), exports);
 tslib_1.__exportStar(require("./generate-config"), exports);
 tslib_1.__exportStar(require("./get-remotes-with-ports"), exports);
 tslib_1.__exportStar(require("./normalize-options"), exports);
-tslib_1.__exportStar(require("./set-tsconfig-target"), exports);
+tslib_1.__exportStar(require("./update-tsconfig"), exports);
 tslib_1.__exportStar(require("./setup-host-if-dynamic"), exports);
 tslib_1.__exportStar(require("./setup-serve-target"), exports);
 tslib_1.__exportStar(require("./update-host-app-routes"), exports);

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

@@ -8,6 +8,7 @@ function normalizeOptions(tree, options) {
         typescriptConfiguration: options.typescriptConfiguration ?? true,
         federationType: options.federationType ?? 'static',
         prefix: options.prefix ?? (0, project_1.getProjectPrefix)(tree, options.appName),
+        standalone: options.standalone ?? true,
     };
 }
 exports.normalizeOptions = normalizeOptions;

package/src/generators/{component/lib/validate-options.d.ts → setup-mf/lib/update-tsconfig.d.ts}

@@ -1,3 +1,3 @@
 import type { Tree } from '@nx/devkit';
 import type { Schema } from '../schema';
-export declare function validateOptions(tree: Tree, options: Schema): void;
+export declare function updateTsConfig(tree: Tree, schema: Schema): void;

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

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.updateTsConfig = void 0;
+const devkit_1 = require("@nx/devkit");
+function updateTsConfig(tree, schema) {
+    const { root } = (0, devkit_1.readProjectConfiguration)(tree, schema.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') {
+            json.files ??= [];
+            json.files.push(schema.standalone
+                ? 'src/app/remote-entry/entry.routes.ts'
+                : 'src/app/remote-entry/entry.module.ts');
+        }
+        return json;
+    });
+}
+exports.updateTsConfig = updateTsConfig;

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

@@ -71,8 +71,8 @@
     },
     "standalone": {
       "type": "boolean",
-      "description": "Whether the application is a standalone application. _Note: This is only supported in Angular versions >= 14.1.0_",
-      "default": false
+      "description": "Whether the application is a standalone application.",
+      "default": true
     },
     "typescriptConfiguration": {
       "type": "boolean",

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

@@ -3,14 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.setupMf = void 0;
 const devkit_1 = require("@nx/devkit");
 const lib_1 = require("./lib");
-const version_utils_1 = require("../utils/version-utils");
 const versions_1 = require("../../utils/versions");
-const semver_1 = require("semver");
 async function setupMf(tree, rawOptions) {
-    const installedAngularInfo = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
-    if ((0, semver_1.lt)(installedAngularInfo.version, '14.1.0') && rawOptions.standalone) {
-        throw new Error(`The --standalone flag is not supported in your current version of Angular (${installedAngularInfo.version}). Please update to a version of Angular that supports Standalone Components (>= 14.1.0).`);
-    }
     const options = (0, lib_1.normalizeOptions)(tree, rawOptions);
     const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.appName);
     let installTask = () => { };
@@ -24,7 +18,7 @@ async function setupMf(tree, rawOptions) {
     const remotesWithPorts = (0, lib_1.getRemotesWithPorts)(tree, options);
     (0, lib_1.generateWebpackConfig)(tree, options, projectConfig.root, remotesWithPorts);
     (0, lib_1.changeBuildTarget)(tree, options);
-    (0, lib_1.updateTsConfigTarget)(tree, options);
+    (0, lib_1.updateTsConfig)(tree, options);
     (0, lib_1.setupServeTarget)(tree, options);
     (0, lib_1.fixBootstrap)(tree, projectConfig.root, options);
     if (options.mfType === 'host') {

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

@@ -0,0 +1,54 @@
+import { APP_BASE_HREF } from '@angular/common';
+import { CommonEngine } from '@angular/ssr';
+import express from 'express';
+import { fileURLToPath } from 'node:url';
+import { dirname, join, resolve } from 'node:path';
+import <% if (standalone) { %>bootstrap<% } else { %>{ <%= rootModuleClassName %> }<% } %> from './src/<%= 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 serverDistFolder = dirname(fileURLToPath(import.meta.url));
+  const browserDistFolder = resolve(serverDistFolder, '../browser');
+  const indexHtml = join(serverDistFolder, 'index.server.html');
+
+  const commonEngine = new CommonEngine();
+
+  server.set('view engine', 'html');
+  server.set('views', browserDistFolder);
+
+  // Example Express Rest API endpoints
+  // server.get('/api/**', (req, res) => { });
+  // Serve static files from /browser
+  server.get('*.*', express.static(browserDistFolder, {
+    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: browserDistFolder,
+        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}`);
+  });
+}

package/src/generators/setup-ssr/files/{ngmodule/base → server/server-builder/pre-v17}/__serverFileName__

@@ -5,8 +5,7 @@ import {ngExpressEngine} from '@nguniversal/express-engine';
 import * as express from 'express';
 import {existsSync} from 'fs';
 import {join} from 'path';
-
-import {<%= rootModuleClassName %>} from './src/<%= main.slice(0, -3) %>';
+import <% if (standalone) { %>bootstrap<% } else { %>{ <%= rootModuleClassName %> }<% } %> from './src/<%= main.slice(0, -3) %>';
 
 // The Express app is exported so that it can be used by serverless Functions.
 export function app(): express.Express {
@@ -16,7 +15,7 @@ export function app(): express.Express {
 
   // Our Universal express-engine (found @ https://github.com/angular/universal/tree/main/modules/express-engine)
   server.engine('html', ngExpressEngine({
-    bootstrap: <%= rootModuleClassName %>,
+    bootstrap<% if (!standalone) { %>: <%= rootModuleClassName %><% } %>,
   }));
 
   server.set('view engine', 'html');
@@ -57,4 +56,4 @@ if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
   run();
 }
 
-export * from './src/<%= main.slice(0, -3) %>';
+export <% if (standalone) { %>default bootstrap<% } else { %>* from './src/<%= main.slice(0, -3) %>'<% } %>;

package/src/generators/setup-ssr/files/{standalone → server/server-builder/v17+}/__serverFileName__

@@ -1,23 +1,21 @@
-import 'zone.js/dist/zone-node';
+import 'zone.js/node';
 
-import {APP_BASE_HREF} from '@angular/common';
-import {ngExpressEngine} from '@nguniversal/express-engine';
+import { APP_BASE_HREF } from '@angular/common';
+import { CommonEngine } from '@angular/ssr';
 import * as express from 'express';
-import {existsSync} from 'fs';
-import {join} from 'path';
-
-import bootstrap from './src/<%= main.slice(0, -3) %>';
+import { existsSync } from 'node:fs';
+import { join } from 'node:path';
+import <% if (standalone) { %>bootstrap<% } else { %>{ <%= rootModuleClassName %> }<% } %> from './src/<%= 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(), '<%= browserBundleOutputPath %>');
-  const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
+  const indexHtml = existsSync(join(distFolder, 'index.original.html'))
+    ? join(distFolder, 'index.original.html')
+    : join(distFolder, 'index.html');
 
-  // Our Universal express-engine (found @ https://github.com/angular/universal/tree/main/modules/express-engine)
-  server.engine('html', ngExpressEngine({
-    bootstrap
-  }));
+  const commonEngine = new CommonEngine();
 
   server.set('view engine', 'html');
   server.set('views', distFolder);
@@ -29,9 +27,20 @@ export function app(): express.Express {
     maxAge: '1y'
   }));
 
-  // All regular routes use the Universal engine
-  server.get('*', (req, res) => {
-    res.render(indexHtml, { req, providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }] });
+  // 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;
@@ -57,4 +66,4 @@ if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
   run();
 }
 
-export default bootstrap;
+export default <% if (standalone) { %>bootstrap<% } else { %><%= rootModuleClassName %><% } %>;

package/src/generators/setup-ssr/lib/add-dependencies.d.ts

@@ -0,0 +1,2 @@
+import { type Tree } from '@nx/devkit';
+export declare function addDependencies(tree: Tree): void;

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

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addDependencies = void 0;
+const devkit_1 = require("@nx/devkit");
+const version_utils_1 = require("../../utils/version-utils");
+function addDependencies(tree) {
+    const pkgVersions = (0, version_utils_1.versions)(tree);
+    const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
+    const dependencies = {
+        '@angular/platform-server': (0, version_utils_1.getInstalledPackageVersionInfo)(tree, '@angular/platform-server')
+            ?.version ?? pkgVersions.angularVersion,
+        express: pkgVersions.expressVersion,
+    };
+    const devDependencies = {
+        '@types/express': pkgVersions.typesExpressVersion,
+    };
+    if (angularMajorVersion >= 17) {
+        dependencies['@angular/ssr'] =
+            (0, version_utils_1.getInstalledPackageVersionInfo)(tree, '@angular-devkit/build-angular')
+                ?.version ?? pkgVersions.angularDevkitVersion;
+    }
+    else {
+        dependencies['@nguniversal/express-engine'] =
+            (0, version_utils_1.getInstalledPackageVersionInfo)(tree, '@nguniversal/express-engine')
+                ?.version ?? pkgVersions.ngUniversalVersion;
+        devDependencies['@nguniversal/builders'] =
+            (0, version_utils_1.getInstalledPackageVersionInfo)(tree, '@nguniversal/builders')?.version ??
+                pkgVersions.ngUniversalVersion;
+    }
+    (0, devkit_1.addDependenciesToPackageJson)(tree, dependencies, devDependencies);
+}
+exports.addDependencies = addDependencies;

package/src/generators/setup-ssr/lib/generate-files.d.ts

@@ -1,3 +1,3 @@
 import type { Tree } from '@nx/devkit';
 import type { Schema } from '../schema';
-export declare function generateSSRFiles(tree: Tree, schema: Schema): void;
+export declare function generateSSRFiles(tree: Tree, schema: Schema, isUsingApplicationBuilder: boolean): void;

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

@@ -4,28 +4,25 @@ exports.generateSSRFiles = void 0;
 const devkit_1 = require("@nx/devkit");
 const semver_1 = require("semver");
 const version_utils_1 = require("../../utils/version-utils");
-const path_1 = require("path");
-function generateSSRFiles(tree, schema) {
-    const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, schema.project);
-    const projectRoot = projectConfig.root;
-    const browserBundleOutputPath = projectConfig.targets.build.options.outputPath;
+function generateSSRFiles(tree, schema, isUsingApplicationBuilder) {
+    const { root: projectRoot, targets } = (0, devkit_1.readProjectConfiguration)(tree, schema.project);
+    const baseOutputPath = targets.build.options.outputPath;
+    const browserBundleOutputPath = (0, devkit_1.joinPathFragments)(baseOutputPath, 'browser');
     const pathToFiles = (0, devkit_1.joinPathFragments)(__dirname, '..', 'files');
-    (0, devkit_1.generateFiles)(tree, (0, path_1.join)(pathToFiles, 'base'), projectRoot, {
-        ...schema,
-        tpl: '',
-    });
+    const { version: angularVersion, major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
     if (schema.standalone) {
         (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'standalone'), projectRoot, { ...schema, browserBundleOutputPath, tpl: '' });
     }
     else {
         (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'ngmodule', 'base'), projectRoot, { ...schema, browserBundleOutputPath, tpl: '' });
-        const { major: angularMajorVersion, version: angularVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
-        if (angularMajorVersion < 15) {
-            (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'ngmodule', 'v14'), projectRoot, { ...schema, browserBundleOutputPath, tpl: '' });
-        }
         if ((0, semver_1.lt)(angularVersion, '15.2.0')) {
             (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'ngmodule', 'pre-v15-2'), projectRoot, { ...schema, browserBundleOutputPath, tpl: '' });
         }
     }
+    (0, devkit_1.generateFiles)(tree, (0, devkit_1.joinPathFragments)(pathToFiles, 'server', ...(isUsingApplicationBuilder
+        ? ['application-builder']
+        : angularMajorVersion >= 17
+            ? ['server-builder', 'v17+']
+            : ['server-builder', 'pre-v17'])), projectRoot, { ...schema, browserBundleOutputPath, tpl: '' });
 }
 exports.generateSSRFiles = generateSSRFiles;

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

@@ -0,0 +1,4 @@
+import { type Tree } from '@nx/devkit';
+import type { Schema } from '../schema';
+export declare function setServerTsConfigOptionsForApplicationBuilder(tree: Tree, options: Schema): void;
+export declare function generateTsConfigServerJsonForBrowserBuilder(tree: Tree, options: Schema): void;

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

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateTsConfigServerJsonForBrowserBuilder = exports.setServerTsConfigOptionsForApplicationBuilder = void 0;
+const devkit_1 = require("@nx/devkit");
+const path_1 = require("path");
+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.files ??= [];
+        json.files.push((0, devkit_1.joinPathFragments)('src', options.main), (0, devkit_1.joinPathFragments)(options.serverFileName));
+        json.compilerOptions ??= {};
+        json.compilerOptions.types ??= [];
+        json.compilerOptions.types.push('node');
+        return json;
+    });
+}
+exports.setServerTsConfigOptionsForApplicationBuilder = setServerTsConfigOptionsForApplicationBuilder;
+function generateTsConfigServerJsonForBrowserBuilder(tree, options) {
+    const { root } = (0, devkit_1.readProjectConfiguration)(tree, options.project);
+    (0, devkit_1.generateFiles)(tree, (0, path_1.join)(__dirname, '..', 'files', 'root'), root, {
+        ...options,
+        tpl: '',
+    });
+}
+exports.generateTsConfigServerJsonForBrowserBuilder = generateTsConfigServerJsonForBrowserBuilder;