@nx/angular 0.0.0-pr-31222-862e973 → 0.0.0-pr-31313-387cdca

package/src/generators/setup-mf/files/ts-webpack/module-federation.config.ts__tmpl__

@@ -1,4 +1,4 @@
-import { ModuleFederationConfig } from '@nx/webpack';
+import { ModuleFederationConfig } from '@nx/module-federation';
 
 const config: ModuleFederationConfig = {
   name: '<%= name %>',<% if(type === 'host') { %>
@@ -21,4 +21,7 @@ const config: ModuleFederationConfig = {
   },<% } %>
 };
 
+/**
+* Nx requires a default export of the config to allow correct resolution of the module federation graph.
+**/
 export default config;

package/src/generators/setup-mf/files/ts-webpack/webpack.config.ts__tmpl__

@@ -1,4 +1,4 @@
-import { withModuleFederation } from '@nx/angular/module-federation';
+import { withModuleFederation } from '@nx/module-federation/angular';
 import config from './module-federation.config';
 
 /**

package/src/generators/setup-mf/files/ts-webpack/webpack.prod.config.ts__tmpl__

@@ -1,4 +1,4 @@
-import { withModuleFederation } from '@nx/angular/module-federation';
+import { withModuleFederation } from '@nx/module-federation/angular';
 import config from './module-federation.config';
 
 /**

package/src/generators/setup-mf/files/webpack/module-federation.config.js__tmpl__

@@ -1,3 +1,6 @@
+/**
+* Nx requires a default export of the config to allow correct resolution of the module federation graph.
+**/
 module.exports = {
   name: '<%= name %>',<% if(type === 'host') { %>
   /**

package/src/generators/setup-mf/files/webpack/webpack.config.js__tmpl__

@@ -1,4 +1,4 @@
-const { withModuleFederation } = require('@nx/angular/module-federation');
+const { withModuleFederation } = require('@nx/module-federation/angular');
 const config = require('./module-federation.config');
 
 /**

package/src/generators/setup-mf/files/webpack/webpack.prod.config.js__tmpl__

@@ -1,4 +1,4 @@
-const { withModuleFederation } = require('@nx/angular/module-federation');
+const { withModuleFederation } = require('@nx/module-federation/angular');
 const config = require('./module-federation.config');
 
 /**

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

@@ -3,7 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.addRemoteEntry = addRemoteEntry;
 const devkit_1 = require("@nx/devkit");
 const route_utils_1 = require("../../../utils/nx-devkit/route-utils");
+const version_utils_1 = require("../../utils/version-utils");
 function addRemoteEntry(tree, { appName, routing, prefix, standalone }, appRoot) {
+    const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
     (0, devkit_1.generateFiles)(tree, standalone
         ? (0, devkit_1.joinPathFragments)(__dirname, '../files/standalone-entry-component-files')
         : (0, devkit_1.joinPathFragments)(__dirname, '../files/entry-module-files'), `${appRoot}/src/app/remote-entry`, {
@@ -11,6 +13,9 @@ function addRemoteEntry(tree, { appName, routing, prefix, standalone }, appRoot)
         appName,
         routing,
         prefix,
+        // Angular v19 or higher defaults to true, while v18 or lower defaults to false
+        setStandaloneFalse: angularMajorVersion >= 19,
+        setStandaloneTrue: angularMajorVersion < 19,
     });
     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)}`);

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

@@ -25,7 +25,7 @@ function addRemoteToHost(tree, options) {
             addRemoteToStaticHost(tree, options, hostProject, isHostUsingTypescriptConfig);
         }
         else if (hostFederationType === 'dynamic') {
-            addRemoteToDynamicHost(tree, options, pathToMFManifest);
+            addRemoteToDynamicHost(tree, options, pathToMFManifest, hostProject.sourceRoot);
         }
         addLazyLoadedRouteToHostAppModule(tree, options, hostFederationType);
     }
@@ -58,15 +58,18 @@ function addRemoteToStaticHost(tree, options, hostProject, isHostUsingTypescript
     const updatedConfig = `${hostMFConfig.slice(0, endOfPropertiesPos)}${isCommaNeeded ? ',' : ''}'${options.appName}',${hostMFConfig.slice(endOfPropertiesPos)}`;
     tree.write(hostMFConfigPath, updatedConfig);
 }
-function addRemoteToDynamicHost(tree, options, pathToMfManifest) {
+function addRemoteToDynamicHost(tree, options, pathToMfManifest, hostSourceRoot) {
+    // TODO(Colum): Remove for Nx 22
+    const usingLegacyDynamicFederation = tree
+        .read(`${hostSourceRoot}/main.ts`, 'utf-8')
+        .includes('setRemoteDefinitions(');
     (0, devkit_1.updateJson)(tree, pathToMfManifest, (manifest) => {
         return {
             ...manifest,
-            [options.appName]: `http://localhost:${options.port}`,
+            [options.appName]: `http://localhost:${options.port}${usingLegacyDynamicFederation ? '' : '/mf-manifest.json'}`,
         };
     });
 }
-// TODO(colum): future work: allow dev to pass to path to routing module
 function addLazyLoadedRouteToHostAppModule(tree, options, hostFederationType) {
     if (!tsModule) {
         tsModule = (0, ensure_typescript_1.ensureTypescript)();
@@ -78,19 +81,29 @@ function addLazyLoadedRouteToHostAppModule(tree, options, hostFederationType) {
     }
     const hostRootRoutingFile = tree.read(pathToHostRootRouting, 'utf-8');
     let sourceFile = tsModule.createSourceFile(pathToHostRootRouting, hostRootRoutingFile, tsModule.ScriptTarget.Latest, true);
+    // TODO(Colum): Remove for Nx 22
+    const usingLegacyDynamicFederation = hostFederationType === 'dynamic' &&
+        tree
+            .read(`${hostAppConfig.sourceRoot}/main.ts`, 'utf-8')
+            .includes('setRemoteDefinitions(');
     if (hostFederationType === 'dynamic') {
-        sourceFile = (0, js_1.insertImport)(tree, sourceFile, pathToHostRootRouting, 'loadRemoteModule', '@nx/angular/mf');
+        sourceFile = (0, js_1.insertImport)(tree, sourceFile, pathToHostRootRouting, usingLegacyDynamicFederation ? 'loadRemoteModule' : 'loadRemote', usingLegacyDynamicFederation
+            ? '@nx/angular/mf'
+            : '@module-federation/enhanced/runtime');
     }
     const routePathName = options.standalone ? 'Routes' : 'Module';
     const exportedRemote = options.standalone
         ? 'remoteRoutes'
         : 'RemoteEntryModule';
+    const remoteModulePath = `${options.appName.replace(/-/g, '_')}/${routePathName}`;
     const routeToAdd = hostFederationType === 'dynamic'
-        ? `loadRemoteModule('${options.appName}', './${routePathName}')`
-        : `import('${options.appName}/${routePathName}')`;
+        ? usingLegacyDynamicFederation
+            ? `loadRemoteModule('${options.appName.replace(/-/g, '_')}', './${routePathName}')`
+            : `loadRemote<typeof import('${remoteModulePath}')>('${remoteModulePath}')`
+        : `import('${remoteModulePath}')`;
     (0, route_utils_1.addRoute)(tree, pathToHostRootRouting, `{
     path: '${options.appName}',
-    loadChildren: () => ${routeToAdd}.then(m => m.${exportedRemote})
+    loadChildren: () => ${routeToAdd}.then(m => m!.${exportedRemote})
     }`);
     const pathToAppComponentTemplate = (0, devkit_1.joinPathFragments)(hostAppConfig.sourceRoot, 'app/app.component.html');
     const appComponent = tree.read(pathToAppComponentTemplate, 'utf-8');

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

@@ -20,11 +20,12 @@ function fixBootstrap(tree, appRoot, options) {
         if (tree.exists((0, devkit_1.joinPathFragments)(appRoot, 'public/module-federation.manifest.json'))) {
             manifestPath = '/module-federation.manifest.json';
         }
-        const fetchMFManifestCode = `import { setRemoteDefinitions } from '@nx/angular/mf';
+        const fetchMFManifestCode = `import { init } from '@module-federation/enhanced/runtime';
 
 fetch('${manifestPath}')
   .then((res) => res.json())
-  .then(definitions => setRemoteDefinitions(definitions))
+  .then((remotes: Record<string, string>) => Object.entries(remotes).map(([name, entry]) => ({ name,entry})))
+  .then(remotes => init({name: '${options.appName}', remotes}))
   .then(() => ${bootstrapImportCode});`;
         tree.write(mainFilePath, fetchMFManifestCode);
     }

package/src/generators/setup-mf/lib/setup-serve-target.js

@@ -17,6 +17,7 @@ function setupServeTarget(host, options) {
     };
     if (options.mfType === 'remote') {
         appConfig.targets['serve-static'] = {
+            continuous: true,
             executor: '@nx/web:file-server',
             defaultConfiguration: 'production',
             options: {

package/src/generators/setup-mf/lib/setup-tspath-for-remote.js

@@ -9,7 +9,7 @@ function setupTspathForRemote(tree, options) {
         ? `./src/app/remote-entry/entry.routes.ts`
         : `./src/app/remote-entry/entry.module.ts`;
     const exportName = options.standalone ? 'Routes' : 'Module';
-    (0, js_1.addTsConfigPath)(tree, `${options.appName}/${exportName}`, [
+    (0, js_1.addTsConfigPath)(tree, `${options.appName.replace(/-/g, '_')}/${exportName}`, [
         (0, devkit_1.joinPathFragments)(project.root, exportPath),
     ]);
 }

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

@@ -34,15 +34,17 @@
     },
     "remotes": {
       "type": "array",
-      "description": "A list of remote application names that the host application should consume."
+      "description": "A list of remote application names that the Consumer (host) application should consume.",
+      "alias": "producers"
     },
     "host": {
       "type": "string",
-      "description": "The name of the host application that the remote application will be consumed by."
+      "description": "The name of the host application that the remote application will be consumed by.",
+      "alias": "consumer"
     },
     "routing": {
       "type": "boolean",
-      "description": "Generate a routing setup to allow a host application to route to the remote application.",
+      "description": "Generate a routing setup to allow a Consumer (host) application to route to the Producer (remote) application.",
       "x-priority": "important"
     },
     "skipFormat": {

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

@@ -19,10 +19,12 @@ 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, {}, {
+            installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {
+                '@module-federation/enhanced': versions_1.moduleFederationEnhancedVersion,
+            }, {
                 '@nx/web': versions_1.nxVersion,
                 '@nx/webpack': versions_1.nxVersion,
-                '@module-federation/enhanced': versions_1.moduleFederationEnhancedVersion,
+                '@nx/module-federation': versions_1.nxVersion,
             });
         }
     }
@@ -46,6 +48,7 @@ async function setupMf(tree, rawOptions) {
             installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, {
                 '@nx/webpack': versions_1.nxVersion,
                 '@module-federation/enhanced': versions_1.moduleFederationEnhancedVersion,
+                '@nx/module-federation': versions_1.nxVersion,
             });
         }
     }

package/src/generators/setup-ssr/files/{server → pre-v19/server}/application-builder/__serverFileName__

@@ -9,7 +9,7 @@ import <% if (standalone) { %>bootstrap<% } else { %><%= rootModuleClassName %><
 export function app(): express.Express {
   const server = express();
   const serverDistFolder = dirname(fileURLToPath(import.meta.url));
-  const browserDistFolder = resolve(serverDistFolder, '../<%= browserBundleOutputPath %>');
+  const browserDistFolder = resolve(serverDistFolder, '../<%= browserDistDirectory %>');
   const indexHtml = join(serverDistFolder, 'index.server.html');
 
   const commonEngine = new CommonEngine();

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

@@ -10,7 +10,7 @@ import <% if (standalone) { %>bootstrap<% } else { %><%= rootModuleClassName %><
 // 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 distFolder = join(process.cwd(), '<%= browserDistDirectory %>');
   const indexHtml = existsSync(join(distFolder, 'index.original.html'))
     ? join(distFolder, 'index.original.html')
     : join(distFolder, 'index.html');

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

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

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

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { ServerModule } from '@angular/platform-server';<% if(serverRouting) { %>
+import { <%= provideServerRoutingFn %> } from '@angular/ssr';<% } %>
+import { AppComponent } from './app.component';
+import { AppModule } from './app.module';<% if(serverRouting) { %>
+import { serverRoutes } from './app.routes.server';<% } %>
+
+@NgModule({
+  imports: [AppModule, ServerModule],<% if(serverRouting) { %>
+  providers: [<%= provideServerRoutingFn %>(serverRoutes)],<% } %>
+  bootstrap: [AppComponent],
+})
+export class <%= rootModuleClassName %> {}

package/src/generators/setup-ssr/files/v19+/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/v19+/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/v19+/application-builder/standalone-src/__main__

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

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

@@ -0,0 +1,14 @@
+import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
+import { provideServerRendering } from '@angular/platform-server';<% if(serverRouting) { %>
+import { <%= provideServerRoutingFn %> } from '@angular/ssr';<% } %>
+import { appConfig } from './app.config';<% if(serverRouting) { %>
+import { serverRoutes } from './app.routes.server';<% } %>
+
+const serverConfig: ApplicationConfig = {
+  providers: [
+    provideServerRendering()<% if(serverRouting) { %>,
+    <%= provideServerRoutingFn %>(serverRoutes)<% } %>
+  ]
+};
+
+export const config = mergeApplicationConfig(appConfig, serverConfig);

package/src/generators/setup-ssr/files/v19+/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/v19+/application-builder-common-engine/server/__serverFileName__

@@ -0,0 +1,67 @@
+import { APP_BASE_HREF } from '@angular/common';
+import { CommonEngine, isMainModule } from '@angular/ssr/node';
+import express from 'express';
+import { dirname, join, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import <% if (standalone) { %>bootstrap<% } else { %><%= rootModuleClassName %><% } %> from './<%= main.slice(0, -3) %>';
+
+const serverDistFolder = dirname(fileURLToPath(import.meta.url));
+const browserDistFolder = resolve(serverDistFolder, '../<%= browserDistDirectory %>');
+const indexHtml = join(serverDistFolder, 'index.server.html');
+
+const app = express();
+const commonEngine = new CommonEngine();
+
+/**
+ * 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.get(
+  '**',
+  express.static(browserDistFolder, {
+    maxAge: '1y',
+    index: 'index.html'
+  }),
+);
+
+/**
+ * Handle all other requests by rendering the Angular application.
+ */
+app.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));
+});
+
+/**
+ * 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 4000.
+ */
+if (isMainModule(import.meta.url)) {
+  const port = process.env['PORT'] || <%= serverPort %>;
+  app.listen(port, () => {
+    console.log(`Node Express server listening on http://localhost:${port}`);
+  });
+}
+
+export default app;

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

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

package/src/generators/setup-ssr/files/v19+/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.module';
+import { AppComponent } from './app.component';
+
+@NgModule({
+  imports: [
+    AppModule,
+    ServerModule,
+  ],
+  bootstrap: [AppComponent],
+})
+export class <%= rootModuleClassName %> {}

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

@@ -0,0 +1,16 @@
+/* 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",
+    "types": [
+      "node"<% if (hasLocalizePackage) { %>,
+      "@angular/localize"<% } %>
+    ]
+  },
+  "files": [
+    "src/<%= main %>",
+    "src/server.ts"
+  ]
+}

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

@@ -1,22 +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 { CommonEngine } from '@angular/ssr/node';
 import * as express from 'express';
-import { existsSync } from 'fs';
-import { join } from 'path';
-import <% if (standalone) { %>bootstrap<% } else { %><%= rootModuleClassName %><% } %> from './src/<%= main.slice(0, -3) %>';
+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(), '<%= browserBundleOutputPath %>');
-  const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
+  const distFolder = join(process.cwd(), '<%= browserDistDirectory %>');
+  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<% if (!standalone) { %>: <%= rootModuleClassName %><% } %>,
-  }));
+  const commonEngine = new CommonEngine();
 
   server.set('view engine', 'html');
   server.set('views', distFolder);
@@ -28,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;
@@ -56,4 +66,4 @@ if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
   run();
 }
 
-export <% if (standalone) { %>default bootstrap<% } else { %>* from './src/<%= main.slice(0, -3) %>'<% } %>;
+export default <% if (standalone) { %>bootstrap<% } else { %><%= rootModuleClassName %><% } %>;

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

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

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

@@ -0,0 +1,11 @@
+import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
+import { provideServerRendering } from '@angular/platform-server';
+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

@@ -6,7 +6,7 @@ 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 { major: angularMajorVersion, version: angularVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(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,
@@ -15,22 +15,11 @@ function addDependencies(tree, isUsingApplicationBuilder) {
     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;
-        if (!isUsingApplicationBuilder && (0, semver_1.gte)(angularVersion, '17.1.0')) {
-            devDependencies['browser-sync'] = pkgVersions.browserSyncVersion;
-        }
-    }
-    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;
+    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')) {
+        devDependencies['browser-sync'] = pkgVersions.browserSyncVersion;
     }
     (0, devkit_1.addDependenciesToPackageJson)(tree, dependencies, devDependencies);
 }

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

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

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

@@ -5,6 +5,7 @@ const devkit_1 = require("@nx/devkit");
 const js_1 = require("@nx/js");
 const ensure_typescript_1 = require("@nx/js/src/utils/typescript/ensure-typescript");
 const ast_utils_1 = require("../../../utils/nx-devkit/ast-utils");
+const version_utils_1 = require("../../utils/version-utils");
 let tsModule;
 let tsquery;
 function addHydration(tree, options) {
@@ -25,11 +26,18 @@ function addHydration(tree, options) {
     const addImport = (source, symbolName, packageName, filePath, isDefault = false) => {
         return (0, js_1.insertImport)(tree, source, filePath, symbolName, packageName, isDefault);
     };
+    const { major: angularMajorVersion } = (0, version_utils_1.getInstalledAngularVersionInfo)(tree);
     sourceFile = addImport(sourceFile, 'provideClientHydration', '@angular/platform-browser', pathToClientConfigFile);
+    if (angularMajorVersion >= 19) {
+        sourceFile = addImport(sourceFile, 'withEventReplay', '@angular/platform-browser', pathToClientConfigFile);
+    }
+    const provider = angularMajorVersion >= 19
+        ? 'provideClientHydration(withEventReplay())'
+        : 'provideClientHydration()';
     if (options.standalone) {
-        (0, ast_utils_1.addProviderToAppConfig)(tree, pathToClientConfigFile, 'provideClientHydration()');
+        (0, ast_utils_1.addProviderToAppConfig)(tree, pathToClientConfigFile, provider);
     }
     else {
-        (0, ast_utils_1.addProviderToModule)(tree, sourceFile, pathToClientConfigFile, 'provideClientHydration()');
+        (0, ast_utils_1.addProviderToModule)(tree, sourceFile, pathToClientConfigFile, provider);
     }
 }

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

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