@schematics/angular 19.0.0-next.9 → 19.0.0-rc.0

package/app-shell/index.js

@@ -106,59 +106,6 @@ function validateProject(mainPath) {
         }
     };
 }
-function addAppShellConfigToWorkspace(options) {
-    return (host, context) => {
-        return (0, workspace_1.updateWorkspace)((workspace) => {
-            const project = workspace.projects.get(options.project);
-            if (!project) {
-                return;
-            }
-            const buildTarget = project.targets.get('build');
-            if (buildTarget?.builder === workspace_models_1.Builders.Application) {
-                // Application builder configuration.
-                const prodConfig = buildTarget.configurations?.production;
-                if (!prodConfig) {
-                    throw new schematics_1.SchematicsException(`A "production" configuration is not defined for the "build" builder.`);
-                }
-                prodConfig.appShell = true;
-                return;
-            }
-            // Webpack based builders configuration.
-            // Validation of targets is handled already in the main function.
-            // Duplicate keys means that we have configurations in both server and build builders.
-            const serverConfigKeys = project.targets.get('server')?.configurations ?? {};
-            const buildConfigKeys = project.targets.get('build')?.configurations ?? {};
-            const configurationNames = Object.keys({
-                ...serverConfigKeys,
-                ...buildConfigKeys,
-            });
-            const configurations = {};
-            for (const key of configurationNames) {
-                if (!serverConfigKeys[key]) {
-                    context.logger.warn(`Skipped adding "${key}" configuration to "app-shell" target as it's missing from "server" target.`);
-                    continue;
-                }
-                if (!buildConfigKeys[key]) {
-                    context.logger.warn(`Skipped adding "${key}" configuration to "app-shell" target as it's missing from "build" target.`);
-                    continue;
-                }
-                configurations[key] = {
-                    browserTarget: `${options.project}:build:${key}`,
-                    serverTarget: `${options.project}:server:${key}`,
-                };
-            }
-            project.targets.add({
-                name: 'app-shell',
-                builder: workspace_models_1.Builders.AppShell,
-                defaultConfiguration: configurations['production'] ? 'production' : undefined,
-                options: {
-                    route: APP_SHELL_ROUTE,
-                },
-                configurations,
-            });
-        });
-    };
-}
 function addRouterModule(mainPath) {
     return (host) => {
         const modulePath = (0, ng_ast_utils_1.getAppModulePath)(host, mainPath);
@@ -184,6 +131,24 @@ function getMetadataProperty(metadata, propertyName) {
     })[0];
     return property;
 }
+function addAppShellConfigToWorkspace(options) {
+    return (0, workspace_1.updateWorkspace)((workspace) => {
+        const project = workspace.projects.get(options.project);
+        if (!project) {
+            return;
+        }
+        const buildTarget = project.targets.get('build');
+        if (buildTarget?.builder === workspace_models_1.Builders.Application ||
+            buildTarget?.builder === workspace_models_1.Builders.BuildApplication) {
+            // Application builder configuration.
+            const prodConfig = buildTarget.configurations?.production;
+            if (!prodConfig) {
+                throw new schematics_1.SchematicsException(`A "production" configuration is not defined for the "build" builder.`);
+            }
+            prodConfig.appShell = true;
+        }
+    });
+}
 function addServerRoutes(options) {
     return async (host) => {
         // The workspace gets updated so this needs to be reloaded
@@ -237,13 +202,12 @@ function addStandaloneServerRoute(options) {
         if (!host.exists(configFilePath)) {
             throw new schematics_1.SchematicsException(`Cannot find "${configFilePath}".`);
         }
+        const recorder = host.beginUpdate(configFilePath);
         let configSourceFile = getSourceFile(host, configFilePath);
         if (!(0, ast_utils_1.isImported)(configSourceFile, 'ROUTES', '@angular/router')) {
             const routesChange = (0, ast_utils_1.insertImport)(configSourceFile, configFilePath, 'ROUTES', '@angular/router');
-            const recorder = host.beginUpdate(configFilePath);
             if (routesChange) {
                 (0, change_1.applyToUpdateRecorder)(recorder, [routesChange]);
-                host.commitUpdate(recorder);
             }
         }
         configSourceFile = getSourceFile(host, configFilePath);
@@ -252,29 +216,59 @@ function addStandaloneServerRoute(options) {
             throw new schematics_1.SchematicsException(`Cannot find the "providers" configuration in "${configFilePath}".`);
         }
         // Add route to providers literal.
-        const newProvidersLiteral = typescript_1.default.factory.updateArrayLiteralExpression(providersLiteral, [
-            ...providersLiteral.elements,
-            typescript_1.default.factory.createObjectLiteralExpression([
-                typescript_1.default.factory.createPropertyAssignment('provide', typescript_1.default.factory.createIdentifier('ROUTES')),
-                typescript_1.default.factory.createPropertyAssignment('multi', typescript_1.default.factory.createIdentifier('true')),
-                typescript_1.default.factory.createPropertyAssignment('useValue', typescript_1.default.factory.createArrayLiteralExpression([
-                    typescript_1.default.factory.createObjectLiteralExpression([
-                        typescript_1.default.factory.createPropertyAssignment('path', typescript_1.default.factory.createIdentifier(`'${APP_SHELL_ROUTE}'`)),
-                        typescript_1.default.factory.createPropertyAssignment('component', typescript_1.default.factory.createIdentifier('AppShellComponent')),
-                    ], true),
-                ], true)),
-            ], true),
-        ]);
-        const recorder = host.beginUpdate(configFilePath);
         recorder.remove(providersLiteral.getStart(), providersLiteral.getWidth());
-        const printer = typescript_1.default.createPrinter();
-        recorder.insertRight(providersLiteral.getStart(), printer.printNode(typescript_1.default.EmitHint.Unspecified, newProvidersLiteral, configSourceFile));
+        const updatedProvidersString = [
+            ...providersLiteral.elements.map((element) => '    ' + element.getText()),
+            `    {
+      provide: ROUTES,
+      multi: true,
+      useValue: [{
+        path: '${APP_SHELL_ROUTE}',
+        component: AppShellComponent
+      }]
+    }\n  `,
+        ];
+        recorder.insertRight(providersLiteral.getStart(), `[\n${updatedProvidersString.join(',\n')}]`);
         // Add AppShellComponent import
         const appShellImportChange = (0, ast_utils_1.insertImport)(configSourceFile, configFilePath, 'AppShellComponent', './app-shell/app-shell.component');
         (0, change_1.applyToUpdateRecorder)(recorder, [appShellImportChange]);
         host.commitUpdate(recorder);
     };
 }
+function addServerRoutingConfig(options) {
+    return async (host) => {
+        const workspace = await (0, workspace_1.getWorkspace)(host);
+        const project = workspace.projects.get(options.project);
+        if (!project) {
+            throw new schematics_1.SchematicsException(`Project name "${options.project}" doesn't not exist.`);
+        }
+        const configFilePath = (0, posix_1.join)(project.sourceRoot ?? 'src', 'app/app.routes.server.ts');
+        if (!host.exists(configFilePath)) {
+            throw new schematics_1.SchematicsException(`Cannot find "${configFilePath}".`);
+        }
+        const sourceFile = getSourceFile(host, configFilePath);
+        const nodes = (0, ast_utils_1.getSourceNodes)(sourceFile);
+        // Find the serverRoutes variable declaration
+        const serverRoutesNode = nodes.find((node) => typescript_1.default.isVariableDeclaration(node) &&
+            node.initializer &&
+            typescript_1.default.isArrayLiteralExpression(node.initializer) &&
+            node.type &&
+            typescript_1.default.isArrayTypeNode(node.type) &&
+            node.type.getText().includes('ServerRoute'));
+        if (!serverRoutesNode) {
+            throw new schematics_1.SchematicsException(`Cannot find the "ServerRoute" configuration in "${configFilePath}".`);
+        }
+        const recorder = host.beginUpdate(configFilePath);
+        const arrayLiteral = serverRoutesNode.initializer;
+        const firstElementPosition = arrayLiteral.elements[0]?.getStart() ?? arrayLiteral.getStart() + 1;
+        const newRouteString = `{
+    path: '${APP_SHELL_ROUTE}',
+    renderMode: RenderMode.AppShell
+  },\n`;
+        recorder.insertLeft(firstElementPosition, newRouteString);
+        host.commitUpdate(recorder);
+    };
+}
 function default_1(options) {
     return async (tree) => {
         const browserEntryPoint = await (0, util_1.getMainFilePath)(tree, options.project);
@@ -282,9 +276,12 @@ function default_1(options) {
         return (0, schematics_1.chain)([
             validateProject(browserEntryPoint),
             (0, schematics_1.schematic)('server', options),
-            addAppShellConfigToWorkspace(options),
-            isStandalone ? (0, schematics_1.noop)() : addRouterModule(browserEntryPoint),
-            isStandalone ? addStandaloneServerRoute(options) : addServerRoutes(options),
+            ...(isStandalone
+                ? [addStandaloneServerRoute(options)]
+                : [addRouterModule(browserEntryPoint), addServerRoutes(options)]),
+            options.serverRouting
+                ? addServerRoutingConfig(options)
+                : addAppShellConfigToWorkspace(options),
             (0, schematics_1.schematic)('component', {
                 name: 'app-shell',
                 module: 'app.module.server.ts',

package/app-shell/schema.d.ts

@@ -6,4 +6,8 @@ export interface Schema {
      * The name of the related client app.
      */
     project: string;
+    /**
+     * Creates a server application using the Server Routing API (Developer Preview).
+     */
+    serverRouting?: boolean;
 }

package/app-shell/schema.json

@@ -12,6 +12,11 @@
       "$default": {
         "$source": "projectName"
       }
+    },
+    "serverRouting": {
+      "description": "Creates a server application using the Server Routing API (Developer Preview).",
+      "type": "boolean",
+      "default": false
     }
   },
   "required": ["project"]

package/application/files/module-files/src/app/app.component.spec.ts.template

@@ -1,4 +1,5 @@
-import { TestBed } from '@angular/core/testing';<% if (routing) { %>
+<% if(experimentalZoneless) { %>import { provideExperimentalZonelessChangeDetection } from '@angular/core';
+<% } %>import { TestBed } from '@angular/core/testing';<% if (routing) { %>
 import { RouterModule } from '@angular/router';<% } %>
 import { AppComponent } from './app.component';
 
@@ -10,7 +11,8 @@ describe('AppComponent', () => {
       ],<% } %>
       declarations: [
         AppComponent
-      ],
+      ],<% if(experimentalZoneless) { %>
+      providers: [provideExperimentalZonelessChangeDetection()]<% } %>
     }).compileComponents();
   });
 

package/application/files/module-files/src/app/app.component.ts.template

@@ -9,7 +9,8 @@ import { Component } from '@angular/core';
      %><router-outlet /><%
     } %>
   `,<% } else { %>
-  templateUrl: './app.component.html',<% } if(inlineStyle) { %>
+  templateUrl: './app.component.html',<% } %>
+  standalone: false,<% if(inlineStyle) { %>
   styles: []<% } else { %>
   styleUrl: './app.component.<%= style %>'<% } %>
 })

package/application/files/module-files/src/app/app.module.ts.template

@@ -1,4 +1,4 @@
-import { NgModule } from '@angular/core';
+import { NgModule<% if(experimentalZoneless) { %>, provideExperimentalZonelessChangeDetection<% } %> } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 <% if (routing) { %>
 import { AppRoutingModule } from './app-routing.module';<% } %>
@@ -12,7 +12,7 @@ import { AppComponent } from './app.component';
     BrowserModule<% if (routing) { %>,
     AppRoutingModule<% } %>
   ],
-  providers: [],
+  providers: [<% if (experimentalZoneless) { %>provideExperimentalZonelessChangeDetection()<% } %>],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

package/application/files/module-files/src/main.ts.template

@@ -1,10 +1,9 @@
 <% if(!!viewEncapsulation) { %>import { ViewEncapsulation } from '@angular/core';
 <% }%>import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-
 import { AppModule } from './app/app.module';
 
 platformBrowserDynamic().bootstrapModule(AppModule, {
-  ngZoneEventCoalescing: true<% if(!!viewEncapsulation) { %>,
+  <% if(!experimentalZoneless) { %>ngZoneEventCoalescing: true,<% } %><% if(!!viewEncapsulation) { %>
   defaultEncapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } %>
 })
   .catch(err => console.error(err));

package/application/files/standalone-files/src/app/app.component.spec.ts.template

@@ -1,10 +1,12 @@
-import { TestBed } from '@angular/core/testing';
+<% if(experimentalZoneless) { %>import { provideExperimentalZonelessChangeDetection } from '@angular/core';
+<% } %>import { TestBed } from '@angular/core/testing';
 import { AppComponent } from './app.component';
 
 describe('AppComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [AppComponent],
+      imports: [AppComponent],<% if(experimentalZoneless) { %>
+      providers: [provideExperimentalZonelessChangeDetection()]<% } %>
     }).compileComponents();
   });
 

package/application/files/standalone-files/src/app/app.component.ts.template

@@ -3,7 +3,6 @@ import { RouterOutlet } from '@angular/router';<% } %>
 
 @Component({
   selector: '<%= selector %>',
-  standalone: true,
   imports: [<% if(routing) { %>RouterOutlet<% } %>],<% if(inlineTemplate) { %>
   template: `
     <h1>Welcome to {{title}}!</h1>

package/application/files/standalone-files/src/app/app.config.ts.template

@@ -1,8 +1,8 @@
-import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';<% if (routing) { %>
+import { ApplicationConfig, <% if(!experimentalZoneless) { %>provideZoneChangeDetection<% } else { %>provideExperimentalZonelessChangeDetection<% } %> } from '@angular/core';<% if (routing) { %>
 import { provideRouter } from '@angular/router';
 
 import { routes } from './app.routes';<% } %>
 
 export const appConfig: ApplicationConfig = {
-  providers: [provideZoneChangeDetection({ eventCoalescing: true })<% if (routing) { %>, provideRouter(routes)<% } %>]
+  providers: [<% if(experimentalZoneless) { %>provideExperimentalZonelessChangeDetection()<% } else { %>provideZoneChangeDetection({ eventCoalescing: true })<% } %><% if (routing) {%>, provideRouter(routes)<% } %>]
 };

package/application/index.js

@@ -78,6 +78,7 @@ function default_1(options) {
             options.ssr
                 ? (0, schematics_1.schematic)('ssr', {
                     project: options.name,
+                    serverRouting: options.serverRouting,
                     skipInstall: true,
                 })
                 : (0, schematics_1.noop)(),
@@ -198,7 +199,7 @@ function addAppToWorkspaceFile(options, appDir, folderName) {
                     outputPath: `dist/${folderName}`,
                     index: `${sourceRoot}/index.html`,
                     browser: `${sourceRoot}/main.ts`,
-                    polyfills: ['zone.js'],
+                    polyfills: options.experimentalZoneless ? [] : ['zone.js'],
                     tsConfig: `${projectRoot}tsconfig.app.json`,
                     inlineStyleLanguage,
                     assets: [{ 'glob': '**/*', 'input': `${projectRoot}public` }],
@@ -238,7 +239,7 @@ function addAppToWorkspaceFile(options, appDir, folderName) {
                 : {
                     builder: workspace_models_1.Builders.Karma,
                     options: {
-                        polyfills: ['zone.js', 'zone.js/testing'],
+                        polyfills: options.experimentalZoneless ? [] : ['zone.js', 'zone.js/testing'],
                         tsConfig: `${projectRoot}tsconfig.spec.json`,
                         inlineStyleLanguage,
                         assets: [{ 'glob': '**/*', 'input': `${projectRoot}public` }],

package/application/schema.d.ts

@@ -2,6 +2,10 @@
  * Generates a new basic application definition in the "projects" subfolder of the workspace.
  */
 export interface Schema {
+    /**
+     * Create an application that does not utilize zone.js.
+     */
+    experimentalZoneless?: boolean;
     /**
      * Include styles inline in the root component.ts file. Only CSS styles can be included
      * inline. Default is false, meaning that an external styles file is created and referenced
@@ -34,6 +38,11 @@ export interface Schema {
      * Creates an application with routing enabled.
      */
     routing?: boolean;
+    /**
+     * Creates a server application using the Server Routing and App Engine APIs (Developer
+     * Preview).
+     */
+    serverRouting?: boolean;
     /**
      * Skip installing dependency packages.
      */

package/application/schema.json

@@ -117,6 +117,15 @@
       "type": "boolean",
       "default": false,
       "x-user-analytics": "ep.ng_ssr"
+    },
+    "serverRouting": {
+      "description": "Creates a server application using the Server Routing and App Engine APIs (Developer Preview).",
+      "type": "boolean"
+    },
+    "experimentalZoneless": {
+      "description": "Create an application that does not utilize zone.js.",
+      "type": "boolean",
+      "default": false
     }
   },
   "required": ["name"]

package/collection.json

@@ -23,10 +23,10 @@
       "schema": "./application/schema.json",
       "description": "Create an Angular application."
     },
-    "e2e": {
+    "private-e2e": {
       "factory": "./e2e",
       "schema": "./e2e/schema.json",
-      "description": "Create an Angular e2e application.",
+      "description": "PRIVATE API - Do not use.",
       "hidden": true
     },
     "class": {

package/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.ts.template

@@ -2,8 +2,9 @@ import { <% if(changeDetection !== 'Default') { %>ChangeDetectionStrategy, <% }%
 
 @Component({<% if(!skipSelector) {%>
   selector: '<%= selector %>',<%}%><% if(standalone) {%>
-  standalone: true,
-  imports: [],<%}%><% if(inlineTemplate) { %>
+  imports: [],<%} else { %>
+  standalone: false,
+  <% }%><% if(inlineTemplate) { %>
   template: `
     <p>
       <%= dasherize(name) %> works!

package/component/index.js

@@ -42,6 +42,7 @@ function default_1(options) {
         options.selector =
             options.selector || buildSelector(options, (project && project.prefix) || '');
         (0, validation_1.validateHtmlSelector)(options.selector);
+        (0, validation_1.validateClassName)(schematics_1.strings.classify(options.name));
         const skipStyleFile = options.inlineStyle || options.style === schema_1.Style.None;
         const templateSource = (0, schematics_1.apply)((0, schematics_1.url)('./files'), [
             options.skipTests ? (0, schematics_1.filter)((path) => !path.endsWith('.spec.ts.template')) : (0, schematics_1.noop)(),

package/config/files/.browserslistrc.template

@@ -13,4 +13,5 @@ last 1 Firefox version
 last 2 Edge major versions
 last 2 Safari major versions
 last 2 iOS major versions
+last 2 Android major versions
 Firefox ESR

package/directive/files/__name@dasherize@if-flat__/__name@dasherize__.directive.ts.template

@@ -1,8 +1,8 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-  selector: '[<%= selector %>]'<% if(standalone) {%>,
-  standalone: true<%}%>
+  selector: '[<%= selector %>]'<% if(!standalone) {%>,
+  standalone: false<%}%>
 })
 export class <%= classify(name) %>Directive {
 

package/directive/index.js

@@ -40,6 +40,7 @@ function default_1(options) {
         options.path = parsedPath.path;
         options.selector = options.selector || buildSelector(options, project.prefix || '');
         (0, validation_1.validateHtmlSelector)(options.selector);
+        (0, validation_1.validateClassName)(schematics_1.strings.classify(options.name));
         const templateSource = (0, schematics_1.apply)((0, schematics_1.url)('./files'), [
             options.skipTests ? (0, schematics_1.filter)((path) => !path.endsWith('.spec.ts.template')) : (0, schematics_1.noop)(),
             (0, schematics_1.applyTemplates)({

package/library/files/README.md.template

@@ -1,24 +1,63 @@
 # <%= classify(name) %>
 
-This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version <%= angularLatestVersion %>.
+This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version <%= angularLatestVersion %>.
 
 ## Code scaffolding
 
-Run `ng generate component component-name --project <%= name %>` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project <%= name %>`.
-> Note: Don't forget to add `--project <%= name %>` or else it will be added to the default project in your `angular.json` file. 
+Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
 
-## Build
+```bash
+ng generate component component-name
+```
 
-Run `ng build <%= name %>` to build the project. The build artifacts will be stored in the `dist/` directory.
+For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
 
-## Publishing
+```bash
+ng generate --help
+```
 
-After building your library with `ng build <%= name %>`, go to the dist folder `cd dist/<%= dasherize(name) %>` and run `npm publish`.
+## Building
+
+To build the library, run:
+
+```bash
+ng build <%= name %>
+```
+
+This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
+
+### Publishing the Library
+
+Once the project is built, you can publish your library by following these steps:
+
+1. Navigate to the `dist` directory:
+   ```bash
+   cd dist/<%= dasherize(name) %>
+   ```
+
+2. Run the `npm publish` command to publish your library to the npm registry:
+   ```bash
+   npm publish
+   ```
 
 ## Running unit tests
 
-Run `ng test <%= name %>` to execute the unit tests via [Karma](https://karma-runner.github.io).
+To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
+
+```bash
+ng test
+```
+
+## Running end-to-end tests
+
+For end-to-end (e2e) testing, run:
+
+```bash
+ng e2e
+```
+
+Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
 
-## Further help
+## Additional Resources
 
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
+For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.

package/ng-new/index.js

@@ -40,6 +40,8 @@ function default_1(options) {
         minimal: options.minimal,
         standalone: options.standalone,
         ssr: options.ssr,
+        serverRouting: options.serverRouting,
+        experimentalZoneless: options.experimentalZoneless,
     };
     return (0, schematics_1.chain)([
         (0, schematics_1.mergeWith)((0, schematics_1.apply)((0, schematics_1.empty)(), [

package/ng-new/schema.d.ts

@@ -16,6 +16,10 @@ export interface Schema {
      * The directory name to create the workspace in.
      */
     directory?: string;
+    /**
+     * Create an application that does not utilize zone.js.
+     */
+    experimentalZoneless?: boolean;
     /**
      * Include styles inline in the component TS file. By default, an external styles file is
      * created and referenced in the component TypeScript file.
@@ -50,6 +54,11 @@ export interface Schema {
      * Enable routing in the initial project.
      */
     routing?: boolean;
+    /**
+     * Creates a server application using the Server Routing and App Engine APIs (Developer
+     * Preview).
+     */
+    serverRouting?: boolean;
     /**
      * Do not initialize a git repository.
      */

package/ng-new/schema.json

@@ -138,6 +138,15 @@
       "description": "Creates an application with Server-Side Rendering (SSR) and Static Site Generation (SSG/Prerendering) enabled.",
       "type": "boolean",
       "x-user-analytics": "ep.ng_ssr"
+    },
+    "serverRouting": {
+      "description": "Creates a server application using the Server Routing and App Engine APIs (Developer Preview).",
+      "type": "boolean"
+    },
+    "experimentalZoneless": {
+      "description": "Create an application that does not utilize zone.js.",
+      "type": "boolean",
+      "default": false
     }
   },
   "required": ["name", "version"]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schematics/angular",
-  "version": "19.0.0-next.9",
+  "version": "19.0.0-rc.0",
   "description": "Schematics specific to Angular",
   "homepage": "https://github.com/angular/angular-cli",
   "keywords": [
@@ -22,8 +22,8 @@
   },
   "schematics": "./collection.json",
   "dependencies": {
-    "@angular-devkit/core": "19.0.0-next.9",
-    "@angular-devkit/schematics": "19.0.0-next.9",
+    "@angular-devkit/core": "19.0.0-rc.0",
+    "@angular-devkit/schematics": "19.0.0-rc.0",
     "jsonc-parser": "3.3.1"
   },
   "packageManager": "yarn@4.5.0",

package/pipe/files/__name@dasherize@if-flat__/__name@dasherize__.pipe.ts.template

@@ -1,8 +1,8 @@
 import { Pipe, PipeTransform } from '@angular/core';
 
 @Pipe({
-  name: '<%= camelize(name) %>'<% if(standalone) {%>,
-  standalone: true<%}%>
+  name: '<%= camelize(name) %>'<% if(!standalone) {%>,
+  standalone: false<%}%>
 })
 export class <%= classify(name) %>Pipe implements PipeTransform {
 

package/server/files/application-builder/ngmodule-src/app/app.module.server.ts.template

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { ServerModule } from '@angular/platform-server';<% if(serverRouting) { %>
+import { provideServerRoutesConfig } 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: [provideServerRoutesConfig(serverRoutes)],<% } %>
+  bootstrap: [AppComponent],
+})
+export class AppServerModule {}

package/server/files/application-builder/ngmodule-src/app/app.routes.server.ts.template

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

package/server/files/application-builder/standalone-src/app/app.config.server.ts.template

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

package/server/files/application-builder/standalone-src/app/app.routes.server.ts.template

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

package/server/files/server-builder/ngmodule-src/main.server.ts.template

@@ -0,0 +1 @@
+export { AppServerModule as default } from './app/app.module.server';

package/server/files/server-builder/standalone-src/main.server.ts.template

@@ -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/server/index.js

@@ -83,11 +83,14 @@ function updateConfigFileApplicationBuilder(options) {
             return;
         }
         const buildTarget = project.targets.get('build');
-        if (buildTarget?.builder !== workspace_models_1.Builders.Application) {
-            throw new schematics_1.SchematicsException(`This schematic requires "${workspace_models_1.Builders.Application}" to be used as a build builder.`);
+        if (!buildTarget) {
+            return;
         }
         buildTarget.options ??= {};
         buildTarget.options['server'] = node_path_1.posix.join(project.sourceRoot ?? node_path_1.posix.join(project.root, 'src'), serverMainEntryName);
+        if (options.serverRouting) {
+            buildTarget.options['outputMode'] = 'static';
+        }
     });
 }
 function updateTsConfigFile(tsConfigPath) {
@@ -137,7 +140,8 @@ function default_1(options) {
         if (!clientBuildTarget) {
             throw (0, project_targets_1.targetBuildNotFoundError)();
         }
-        const isUsingApplicationBuilder = clientBuildTarget.builder === workspace_models_1.Builders.Application;
+        const isUsingApplicationBuilder = clientBuildTarget.builder === workspace_models_1.Builders.Application ||
+            clientBuildTarget.builder === workspace_models_1.Builders.BuildApplication;
         if (clientProject.targets.has('server') ||
             (isUsingApplicationBuilder && clientBuildTarget.options?.server !== undefined)) {
             // Server has already been added.
@@ -146,12 +150,18 @@ function default_1(options) {
         const clientBuildOptions = clientBuildTarget.options;
         const browserEntryPoint = await (0, util_1.getMainFilePath)(host, options.project);
         const isStandalone = (0, ng_ast_utils_1.isStandaloneApp)(host, browserEntryPoint);
-        const templateSource = (0, schematics_1.apply)((0, schematics_1.url)(isStandalone ? './files/standalone-src' : './files/src'), [
+        const sourceRoot = clientProject.sourceRoot ?? (0, core_1.join)((0, core_1.normalize)(clientProject.root), 'src');
+        let filesUrl = `./files/${isUsingApplicationBuilder ? 'application-builder/' : 'server-builder/'}`;
+        filesUrl += isStandalone ? 'standalone-src' : 'ngmodule-src';
+        const templateSource = (0, schematics_1.apply)((0, schematics_1.url)(filesUrl), [
+            options.serverRouting
+                ? (0, schematics_1.noop)()
+                : (0, schematics_1.filter)((path) => !path.endsWith('app.routes.server.ts.template')),
             (0, schematics_1.applyTemplates)({
                 ...schematics_1.strings,
                 ...options,
             }),
-            (0, schematics_1.move)((0, core_1.join)((0, core_1.normalize)(clientProject.root), 'src')),
+            (0, schematics_1.move)(sourceRoot),
         ]);
         const clientTsConfig = (0, core_1.normalize)(clientBuildOptions.tsConfig);
         const tsConfigExtends = (0, core_1.basename)(clientTsConfig);
@@ -164,7 +174,7 @@ function default_1(options) {
                     updateTsConfigFile(clientBuildOptions.tsConfig),
                 ]
                 : [
-                    (0, schematics_1.mergeWith)((0, schematics_1.apply)((0, schematics_1.url)('./files/root'), [
+                    (0, schematics_1.mergeWith)((0, schematics_1.apply)((0, schematics_1.url)('./files/server-builder/root'), [
                         (0, schematics_1.applyTemplates)({
                             ...schematics_1.strings,
                             ...options,

package/server/schema.d.ts

@@ -6,6 +6,11 @@ export interface Schema {
      * The name of the project.
      */
     project: string;
+    /**
+     * Creates a server application using the Server Routing and App Engine APIs (Developer
+     * Preview).
+     */
+    serverRouting?: boolean;
     /**
      * Do not install packages for dependencies.
      */

package/server/schema.json

@@ -17,6 +17,10 @@
       "description": "Do not install packages for dependencies.",
       "type": "boolean",
       "default": false
+    },
+    "serverRouting": {
+      "description": "Creates a server application using the Server Routing and App Engine APIs (Developer Preview).",
+      "type": "boolean"
     }
   },
   "required": ["project"]

package/service-worker/files/ngsw-config.json.template

@@ -8,6 +8,7 @@
       "resources": {
         "files": [
           "/favicon.ico",
+          "/index.csr.html",
           "/index.html",
           "/manifest.webmanifest",
           "/*.css",

package/ssr/files/application-builder/server.ts.template

@@ -1,57 +1,72 @@
-import { APP_BASE_HREF } from '@angular/common';
-import { CommonEngine } from '@angular/ssr/node';
+import {
+  AngularNodeAppEngine,
+  createNodeRequestHandler,
+  isMainModule,
+  writeResponseToNodeResponse,
+} from '@angular/ssr/node';
 import express from 'express';
+import { dirname, resolve } from 'node:path';
 import { fileURLToPath } from 'node:url';
-import { dirname, join, resolve } from 'node:path';
-import <% if (isStandalone) { %>bootstrap<% } else { %>AppServerModule<% } %> from './src/main.server';
 
-// 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, '../<%= browserDistDirectory %>');
-  const indexHtml = join(serverDistFolder, 'index.server.html');
+const serverDistFolder = dirname(fileURLToPath(import.meta.url));
+const browserDistFolder = resolve(serverDistFolder, '../<%= browserDistDirectory %>');
 
-  const commonEngine = new CommonEngine();
+const app = express();
+const angularApp = new AngularNodeAppEngine();
 
-  server.set('view engine', 'html');
-  server.set('views', browserDistFolder);
+/**
+ * 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
+ * });
+ * ```
+ */
 
-  // Example Express Rest API endpoints
-  // server.get('/api/**', (req, res) => { });
-  // Serve static files from /<%= browserDistDirectory %>
-  server.get('**', express.static(browserDistFolder, {
+/**
+ * Serve static files from /<%= browserDistDirectory %>
+ */
+app.get(
+  '**',
+  express.static(browserDistFolder, {
     maxAge: '1y',
     index: 'index.html',
-  }));
+    setHeaders: (res) => {
+      const headers = angularApp.getPrerenderHeaders(res.req);
+      for (const [key, value] of headers) {
+        res.setHeader(key, value);
+      }
+    },
+  }),
+);
 
-  // All regular routes use the Angular engine
-  server.get('**', (req, res, next) => {
-    const { protocol, originalUrl, baseUrl, headers } = req;
+/**
+ * Handle all other requests by rendering the Angular application.
+ */
+app.get('**', (req, res, next) => {
+  angularApp
+    .render(req)
+    .then((response) =>
+      response ? writeResponseToNodeResponse(response, res) : next(),
+    )
+    .catch(next);
+});
 
-    commonEngine
-      .render({
-        <% if (isStandalone) { %>bootstrap<% } else { %>bootstrap: AppServerModule<% } %>,
-        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 {
+/**
+ * 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'] || 4000;
-
-  // Start up the Node server
-  const server = app();
-  server.listen(port, () => {
+  app.listen(port, () => {
     console.log(`Node Express server listening on http://localhost:${port}`);
   });
 }
 
-run();
+/**
+ * The request handler used by the Angular CLI (dev-server and during build).
+ */
+export const reqHandler = createNodeRequestHandler(app);

package/ssr/files/application-builder-common-engine/server.ts.template

@@ -0,0 +1,65 @@
+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 (isStandalone) { %>bootstrap<% } else { %>AppServerModule<% } %> from './main.server';
+
+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({
+      <% if (isStandalone) { %>bootstrap<% } else { %>bootstrap: AppServerModule<% } %>,
+      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'] || 4000;
+  app.listen(port, () => {
+    console.log(`Node Express server listening on http://localhost:${port}`);
+  });
+}

package/ssr/files/server-builder/server.ts.template

@@ -5,7 +5,7 @@ import { CommonEngine } from '@angular/ssr/node';
 import * as express from 'express';
 import { existsSync } from 'node:fs';
 import { join } from 'node:path';
-import <% if (isStandalone) { %>bootstrap<% } else { %>AppServerModule<% } %> from './src/main.server';
+import <% if (isStandalone) { %>bootstrap<% } else { %>AppServerModule<% } %> from './main.server';
 
 // The Express app is exported so that it can be used by serverless Functions.
 export function app(): express.Express {

package/ssr/index.js

@@ -108,15 +108,14 @@ function updateApplicationBuilderTsConfigRule(options) {
             // No tsconfig path
             return;
         }
-        const tsConfig = new json_file_1.JSONFile(host, tsConfigPath);
-        const filesAstNode = tsConfig.get(['files']);
-        const serverFilePath = 'server.ts';
-        if (Array.isArray(filesAstNode) && !filesAstNode.some(({ text }) => text === serverFilePath)) {
-            tsConfig.modify(['files'], [...filesAstNode, serverFilePath]);
-        }
+        const json = new json_file_1.JSONFile(host, tsConfigPath);
+        const filesPath = ['files'];
+        const files = new Set(json.get(filesPath) ?? []);
+        files.add('src/server.ts');
+        json.modify(filesPath, [...files]);
     };
 }
-function updateApplicationBuilderWorkspaceConfigRule(projectRoot, options, { logger }) {
+function updateApplicationBuilderWorkspaceConfigRule(projectSourceRoot, options, { logger }) {
     return (0, utility_1.updateWorkspace)((workspace) => {
         const buildTarget = workspace.projects.get(options.project)?.targets.get('build');
         if (!buildTarget) {
@@ -140,14 +139,15 @@ function updateApplicationBuilderWorkspaceConfigRule(projectRoot, options, { log
         buildTarget.options = {
             ...buildTarget.options,
             outputPath,
-            prerender: true,
+            outputMode: options.serverRouting ? 'server' : undefined,
+            prerender: options.serverRouting ? undefined : true,
             ssr: {
-                entry: (0, core_1.join)((0, core_1.normalize)(projectRoot), 'server.ts'),
+                entry: (0, core_1.join)((0, core_1.normalize)(projectSourceRoot), 'server.ts'),
             },
         };
     });
 }
-function updateWebpackBuilderWorkspaceConfigRule(options) {
+function updateWebpackBuilderWorkspaceConfigRule(projectSourceRoot, options) {
     return (0, utility_1.updateWorkspace)((workspace) => {
         const projectName = options.project;
         const project = workspace.projects.get(projectName);
@@ -156,7 +156,7 @@ function updateWebpackBuilderWorkspaceConfigRule(options) {
         }
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         const serverTarget = project.targets.get('server');
-        (serverTarget.options ??= {}).main = (0, core_1.join)((0, core_1.normalize)(project.root), 'server.ts');
+        (serverTarget.options ??= {}).main = node_path_1.posix.join(projectSourceRoot, 'server.ts');
         const serveSSRTarget = project.targets.get(SERVE_SSR_TARGET_NAME);
         if (serveSSRTarget) {
             return;
@@ -216,7 +216,7 @@ function updateWebpackBuilderServerTsConfigRule(options) {
         }
         const tsConfig = new json_file_1.JSONFile(host, tsConfigPath);
         const filesAstNode = tsConfig.get(['files']);
-        const serverFilePath = 'server.ts';
+        const serverFilePath = 'src/server.ts';
         if (Array.isArray(filesAstNode) && !filesAstNode.some(({ text }) => text === serverFilePath)) {
             tsConfig.modify(['files'], [...filesAstNode, serverFilePath]);
         }
@@ -242,7 +242,7 @@ function addDependencies({ skipInstall }, isUsingApplicationBuilder) {
     }
     return (0, schematics_1.chain)(rules);
 }
-function addServerFile(options, isStandalone) {
+function addServerFile(projectSourceRoot, options, isStandalone) {
     return async (host) => {
         const projectName = options.project;
         const workspace = await (0, utility_1.readWorkspace)(host);
@@ -254,14 +254,15 @@ function addServerFile(options, isStandalone) {
         const browserDistDirectory = isUsingApplicationBuilder
             ? (await getApplicationBuilderOutputPaths(host, projectName)).browser
             : await getLegacyOutputPaths(host, projectName, 'build');
-        return (0, schematics_1.mergeWith)((0, schematics_1.apply)((0, schematics_1.url)(`./files/${isUsingApplicationBuilder ? 'application-builder' : 'server-builder'}`), [
+        const applicationBuilderFiles = 'application-builder' + (options.serverRouting ? '' : '-common-engine');
+        return (0, schematics_1.mergeWith)((0, schematics_1.apply)((0, schematics_1.url)(`./files/${isUsingApplicationBuilder ? applicationBuilderFiles : 'server-builder'}`), [
             (0, schematics_1.applyTemplates)({
                 ...core_1.strings,
                 ...options,
                 browserDistDirectory,
                 isStandalone,
             }),
-            (0, schematics_1.move)(project.root),
+            (0, schematics_1.move)(projectSourceRoot),
         ]));
     };
 }
@@ -275,6 +276,7 @@ function default_1(options) {
             throw (0, project_targets_1.targetBuildNotFoundError)();
         }
         const isUsingApplicationBuilder = usingApplicationBuilder(clientProject);
+        const sourceRoot = clientProject.sourceRoot ?? node_path_1.posix.join(clientProject.root, 'src');
         return (0, schematics_1.chain)([
             (0, schematics_1.schematic)('server', {
                 ...options,
@@ -282,14 +284,14 @@ function default_1(options) {
             }),
             ...(isUsingApplicationBuilder
                 ? [
-                    updateApplicationBuilderWorkspaceConfigRule(clientProject.root, options, context),
+                    updateApplicationBuilderWorkspaceConfigRule(sourceRoot, options, context),
                     updateApplicationBuilderTsConfigRule(options),
                 ]
                 : [
                     updateWebpackBuilderServerTsConfigRule(options),
-                    updateWebpackBuilderWorkspaceConfigRule(options),
+                    updateWebpackBuilderWorkspaceConfigRule(sourceRoot, options),
                 ]),
-            addServerFile(options, isStandalone),
+            addServerFile(sourceRoot, options, isStandalone),
             addScriptsRule(options, isUsingApplicationBuilder),
             addDependencies(options, isUsingApplicationBuilder),
         ]);

package/ssr/schema.d.ts

@@ -3,6 +3,11 @@ export interface Schema {
      * The name of the project.
      */
     project: string;
+    /**
+     * Creates a server application using the Server Routing and App Engine APIs (Developer
+     * Preview).
+     */
+    serverRouting?: boolean;
     /**
      * Skip installing dependency packages.
      */

package/ssr/schema.json

@@ -15,6 +15,12 @@
       "description": "Skip installing dependency packages.",
       "type": "boolean",
       "default": false
+    },
+    "serverRouting": {
+      "description": "Creates a server application using the Server Routing and App Engine APIs (Developer Preview).",
+      "x-prompt": "Would you like to use the Server Routing and App Engine APIs (Developer Preview) for this server application?",
+      "type": "boolean",
+      "default": false
     }
   },
   "required": ["project"],

package/utility/latest-versions/package.json

@@ -9,7 +9,7 @@
     "@types/node": "^18.18.0",
     "browser-sync": "^3.0.0",
     "express": "^4.18.2",
-    "jasmine-core": "~5.3.0",
+    "jasmine-core": "~5.4.0",
     "jasmine-spec-reporter": "~7.0.0",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.0",

package/utility/latest-versions.js

@@ -15,6 +15,6 @@ exports.latestVersions = {
     ...dependencies,
     // As Angular CLI works with same minor versions of Angular Framework, a tilde match for the current
     Angular: dependencies['@angular/core'],
-    DevkitBuildAngular: '^19.0.0-next.9',
-    AngularSSR: '^19.0.0-next.9',
+    DevkitBuildAngular: '^19.0.0-rc.0',
+    AngularSSR: '^19.0.0-rc.0',
 };

package/utility/workspace-models.d.ts

@@ -28,7 +28,7 @@ export declare enum Builders {
     NgPackagr = "@angular-devkit/build-angular:ng-packagr",
     DevServer = "@angular-devkit/build-angular:dev-server",
     ExtractI18n = "@angular-devkit/build-angular:extract-i18n",
-    Protractor = "@angular-devkit/build-angular:protractor",
+    Protractor = "@angular-devkit/build-angular:private-protractor",
     BuildApplication = "@angular/build:application"
 }
 export interface FileReplacements {

package/utility/workspace-models.js

@@ -33,6 +33,6 @@ var Builders;
     Builders["NgPackagr"] = "@angular-devkit/build-angular:ng-packagr";
     Builders["DevServer"] = "@angular-devkit/build-angular:dev-server";
     Builders["ExtractI18n"] = "@angular-devkit/build-angular:extract-i18n";
-    Builders["Protractor"] = "@angular-devkit/build-angular:protractor";
+    Builders["Protractor"] = "@angular-devkit/build-angular:private-protractor";
     Builders["BuildApplication"] = "@angular/build:application";
 })(Builders || (exports.Builders = Builders = {}));

package/workspace/files/README.md.template

@@ -1,27 +1,59 @@
 # <%= utils.classify(name) %>
 
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version <%= version %>.
+This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version <%= version %>.
 
 ## Development server
 
-Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
+To start a local development server, run:
+
+```bash
+ng serve
+```
+
+Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files.
 
 ## Code scaffolding
 
-Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
+
+```bash
+ng generate component component-name
+```
+
+For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
+
+```bash
+ng generate --help
+```
 
-## Build
+## Building
 
-Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
+To build the project run:
+
+```bash
+ng build
+```
+
+This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed.
 
 ## Running unit tests
 
-Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
+
+```bash
+ng test
+```
 
 ## Running end-to-end tests
 
-Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
+For end-to-end (e2e) testing, run:
+
+```bash
+ng e2e
+```
+
+Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
 
-## Further help
+## Additional Resources
 
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
+For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.