@schematics/angular 20.0.0-next.0 → 20.0.0-next.2

package/migrations/replace-provide-server-rendering-import/migration.js

@@ -0,0 +1,133 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = default_1;
+const ts = __importStar(require("../../third_party/github.com/Microsoft/TypeScript/lib/typescript"));
+const dependencies_1 = require("../../utility/dependencies");
+const latest_versions_1 = require("../../utility/latest-versions");
+function* visit(directory) {
+    for (const path of directory.subfiles) {
+        if (path.endsWith('.ts') && !path.endsWith('.d.ts')) {
+            const entry = directory.file(path);
+            if (entry) {
+                const content = entry.content;
+                if (content.includes('provideServerRendering') &&
+                    content.includes('@angular/platform-server')) {
+                    // Only need to rename the import so we can just string replacements.
+                    yield [entry.path, content.toString()];
+                }
+            }
+        }
+    }
+    for (const path of directory.subdirs) {
+        if (path === 'node_modules' || path.startsWith('.')) {
+            continue;
+        }
+        yield* visit(directory.dir(path));
+    }
+}
+function default_1() {
+    return async (tree) => {
+        let angularSSRAdded = false;
+        for (const [filePath, content] of visit(tree.root)) {
+            let updatedContent = content;
+            const ssrImports = new Set();
+            const platformServerImports = new Set();
+            const sourceFile = ts.createSourceFile(filePath, content, ts.ScriptTarget.Latest, true);
+            sourceFile.forEachChild((node) => {
+                if (ts.isImportDeclaration(node)) {
+                    const moduleSpecifier = node.moduleSpecifier.getText(sourceFile);
+                    if (moduleSpecifier.includes('@angular/platform-server')) {
+                        const importClause = node.importClause;
+                        if (importClause &&
+                            importClause.namedBindings &&
+                            ts.isNamedImports(importClause.namedBindings)) {
+                            const namedImports = importClause.namedBindings.elements.map((e) => e.getText(sourceFile));
+                            namedImports.forEach((importName) => {
+                                if (importName === 'provideServerRendering') {
+                                    ssrImports.add(importName);
+                                }
+                                else {
+                                    platformServerImports.add(importName);
+                                }
+                            });
+                        }
+                        updatedContent = updatedContent.replace(node.getFullText(sourceFile), '');
+                    }
+                    else if (moduleSpecifier.includes('@angular/ssr')) {
+                        const importClause = node.importClause;
+                        if (importClause &&
+                            importClause.namedBindings &&
+                            ts.isNamedImports(importClause.namedBindings)) {
+                            importClause.namedBindings.elements.forEach((e) => {
+                                ssrImports.add(e.getText(sourceFile));
+                            });
+                        }
+                        updatedContent = updatedContent.replace(node.getFullText(sourceFile), '');
+                    }
+                }
+            });
+            if (platformServerImports.size > 0) {
+                updatedContent =
+                    `import { ${Array.from(platformServerImports).sort().join(', ')} } from '@angular/platform-server';\n` +
+                        updatedContent;
+            }
+            if (ssrImports.size > 0) {
+                updatedContent =
+                    `import { ${Array.from(ssrImports).sort().join(', ')} } from '@angular/ssr';\n` +
+                        updatedContent;
+            }
+            if (content !== updatedContent) {
+                tree.overwrite(filePath, updatedContent);
+                if (!angularSSRAdded) {
+                    (0, dependencies_1.addPackageJsonDependency)(tree, {
+                        name: '@angular/ssr',
+                        version: latest_versions_1.latestVersions.AngularSSR,
+                        type: dependencies_1.NodeDependencyType.Default,
+                        overwrite: false,
+                    });
+                    angularSSRAdded = true;
+                }
+            }
+        }
+    };
+}

package/migrations/replace-provide-server-routing/migration.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+import { Rule } from '@angular-devkit/schematics';
+export default function (): Rule;

package/migrations/replace-provide-server-routing/migration.js

@@ -0,0 +1,122 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = default_1;
+const ts = __importStar(require("../../third_party/github.com/Microsoft/TypeScript/lib/typescript"));
+const dependencies_1 = require("../../utility/dependencies");
+function* visit(directory) {
+    for (const path of directory.subfiles) {
+        if (path.endsWith('.ts') && !path.endsWith('.d.ts')) {
+            const entry = directory.file(path);
+            if (entry) {
+                const content = entry.content;
+                if (content.includes('provideServerRouting') && content.includes('@angular/ssr')) {
+                    // Only need to rename the import so we can just string replacements.
+                    yield [entry.path, content.toString()];
+                }
+            }
+        }
+    }
+    for (const path of directory.subdirs) {
+        if (path === 'node_modules' || path.startsWith('.')) {
+            continue;
+        }
+        yield* visit(directory.dir(path));
+    }
+}
+function default_1() {
+    return async (tree) => {
+        if (!(0, dependencies_1.getPackageJsonDependency)(tree, '@angular/ssr')) {
+            return;
+        }
+        for (const [filePath, content] of visit(tree.root)) {
+            const recorder = tree.beginUpdate(filePath);
+            const sourceFile = ts.createSourceFile(filePath, content, ts.ScriptTarget.Latest, true);
+            function visit(node) {
+                if (ts.isPropertyAssignment(node) &&
+                    ts.isIdentifier(node.name) &&
+                    node.name.text === 'providers' &&
+                    ts.isArrayLiteralExpression(node.initializer)) {
+                    const providersArray = node.initializer;
+                    const newProviders = providersArray.elements
+                        .filter((el) => {
+                        return !(ts.isCallExpression(el) &&
+                            ts.isIdentifier(el.expression) &&
+                            el.expression.text === 'provideServerRendering');
+                    })
+                        .map((el) => {
+                        if (ts.isCallExpression(el) &&
+                            ts.isIdentifier(el.expression) &&
+                            el.expression.text === 'provideServerRouting') {
+                            const [withRouteVal, ...others] = el.arguments.map((arg) => arg.getText());
+                            return `provideServerRendering(withRoutes(${withRouteVal})${others.length ? ', ' + others.join(', ') : ''})`;
+                        }
+                        return el.getText();
+                    });
+                    // Update the 'providers' array in the source file
+                    recorder.remove(providersArray.getStart(), providersArray.getWidth());
+                    recorder.insertRight(providersArray.getStart(), `[${newProviders.join(', ')}]`);
+                }
+                ts.forEachChild(node, visit);
+            }
+            // Visit all nodes to update 'providers'
+            visit(sourceFile);
+            // Update imports by removing 'provideServerRouting'
+            const importDecl = sourceFile.statements.find((stmt) => ts.isImportDeclaration(stmt) &&
+                ts.isStringLiteral(stmt.moduleSpecifier) &&
+                stmt.moduleSpecifier.text === '@angular/ssr');
+            if (importDecl?.importClause?.namedBindings) {
+                const namedBindings = importDecl?.importClause.namedBindings;
+                if (ts.isNamedImports(namedBindings)) {
+                    const elements = namedBindings.elements;
+                    const updatedElements = elements
+                        .map((el) => el.getText())
+                        .filter((x) => x !== 'provideServerRouting');
+                    updatedElements.push('withRoutes');
+                    recorder.remove(namedBindings.getStart(), namedBindings.getWidth());
+                    recorder.insertLeft(namedBindings.getStart(), `{ ${updatedElements.sort().join(', ')} }`);
+                }
+            }
+            tree.commitUpdate(recorder);
+        }
+    };
+}

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

@@ -1,8 +1,8 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';<% if (lazyRoute) { %>
-import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';<% } %>
+import { <%= classify(name) %> } from './<%= dasherize(name) %>';<% } %>
 
-const routes: Routes = [<% if (lazyRoute) { %>{ path: '', component: <%= classify(name) %>Component }<% } %>];
+const routes: Routes = [<% if (lazyRoute) { %>{ path: '', component: <%= classify(name) %> }<% } %>];
 
 @NgModule({
   imports: [RouterModule.for<%= routingScope %>(routes)],

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

@@ -5,7 +5,7 @@ import { Routes, RouterModule } from '@angular/router';<% } %>
 import { <%= classify(name) %>RoutingModule } from './<%= dasherize(name) %>-routing.module';<% } %>
 <% if (lazyRouteWithoutRouteModule) { %>
 const routes: Routes = [
-  { path: '', component: <%= classify(name) %>Component }
+  { path: '', component: <%= classify(name) %> }
 ];<% } %>
 
 @NgModule({

package/ng-new/index.js

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

package/ng-new/schema.d.ts

@@ -66,11 +66,6 @@ export type Schema = {
      * modules for managing navigation between different views in your application.
      */
     routing?: boolean;
-    /**
-     * Create a server application in the initial project using the Server Routing and App
-     * Engine APIs (Developer Preview).
-     */
-    serverRouting?: boolean;
     /**
      * Do not initialize a Git repository in the new workspace. By default, a Git repository is
      * initialized to help you track changes to your project.

package/ng-new/schema.json

@@ -139,10 +139,6 @@
       "type": "boolean",
       "x-user-analytics": "ep.ng_ssr"
     },
-    "serverRouting": {
-      "description": "Create a server application in the initial project using the Server Routing and App Engine APIs (Developer Preview).",
-      "type": "boolean"
-    },
     "experimentalZoneless": {
       "description": "Create an initial application that does not utilize `zone.js`.",
       "type": "boolean",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schematics/angular",
-  "version": "20.0.0-next.0",
+  "version": "20.0.0-next.2",
   "description": "Schematics specific to Angular",
   "homepage": "https://github.com/angular/angular-cli",
   "keywords": [
@@ -22,14 +22,15 @@
   },
   "schematics": "./collection.json",
   "dependencies": {
-    "@angular-devkit/core": "20.0.0-next.0",
-    "@angular-devkit/schematics": "20.0.0-next.0",
+    "@angular-devkit/core": "20.0.0-next.2",
+    "@angular-devkit/schematics": "20.0.0-next.2",
     "jsonc-parser": "3.3.1"
   },
   "repository": {
     "type": "git",
     "url": "https://github.com/angular/angular-cli.git"
   },
+  "packageManager": "pnpm@9.15.6",
   "engines": {
     "node": "^20.11.1 || >=22.0.0",
     "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",

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

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

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

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

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

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

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

@@ -2,13 +2,13 @@ import { NgModule } from '@angular/core';
 import { ServerModule } from '@angular/platform-server';
 
 import { AppModule } from './app.module';
-import { AppComponent } from './app.component';
+import { App } from './app';
 
 @NgModule({
   imports: [
     AppModule,
     ServerModule,
   ],
-  bootstrap: [AppComponent],
+  bootstrap: [App],
 })
 export class AppServerModule {}

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

@@ -1,5 +1,5 @@
 import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
-import { provideServerRendering } from '@angular/platform-server';
+import { provideServerRendering } from '@angular/ssr';
 import { appConfig } from './app.config';
 
 const serverConfig: ApplicationConfig = {

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

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

package/server/index.js

@@ -88,9 +88,7 @@ function updateConfigFileApplicationBuilder(options) {
         }
         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';
-        }
+        buildTarget.options['outputMode'] = 'static';
     });
 }
 function updateTsConfigFile(tsConfigPath) {
@@ -140,10 +138,9 @@ function default_1(options) {
         if (!clientBuildTarget) {
             throw (0, project_targets_1.targetBuildNotFoundError)();
         }
-        const isUsingApplicationBuilder = clientBuildTarget.builder === workspace_models_1.Builders.Application ||
-            clientBuildTarget.builder === workspace_models_1.Builders.BuildApplication;
+        const usingApplicationBuilder = (0, project_targets_1.isUsingApplicationBuilder)(clientProject);
         if (clientProject.targets.has('server') ||
-            (isUsingApplicationBuilder && clientBuildTarget.options?.server !== undefined)) {
+            (usingApplicationBuilder && clientBuildTarget.options?.server !== undefined)) {
             // Server has already been added.
             return;
         }
@@ -151,12 +148,9 @@ function default_1(options) {
         const browserEntryPoint = await (0, util_1.getMainFilePath)(host, options.project);
         const isStandalone = (0, ng_ast_utils_1.isStandaloneApp)(host, browserEntryPoint);
         const sourceRoot = clientProject.sourceRoot ?? (0, core_1.join)((0, core_1.normalize)(clientProject.root), 'src');
-        let filesUrl = `./files/${isUsingApplicationBuilder ? 'application-builder/' : 'server-builder/'}`;
+        let filesUrl = `./files/${usingApplicationBuilder ? '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,
@@ -168,7 +162,7 @@ function default_1(options) {
         const tsConfigDirectory = (0, core_1.dirname)(clientTsConfig);
         return (0, schematics_1.chain)([
             (0, schematics_1.mergeWith)(templateSource),
-            ...(isUsingApplicationBuilder
+            ...(usingApplicationBuilder
                 ? [
                     updateConfigFileApplicationBuilder(options),
                     updateTsConfigFile(clientBuildOptions.tsConfig),

package/server/schema.d.ts

@@ -8,11 +8,6 @@ export type Schema = {
      * The name of the project to enable server-side rendering for.
      */
     project: string;
-    /**
-     * Configure the server application to use the Server Routing and App Engine APIs (Developer
-     * Preview).
-     */
-    serverRouting?: boolean;
     /**
      * Skip the automatic installation of packages. You will need to manually install the
      * dependencies later.

package/server/schema.json

@@ -17,10 +17,6 @@
       "description": "Skip the automatic installation of packages. You will need to manually install the dependencies later.",
       "type": "boolean",
       "default": false
-    },
-    "serverRouting": {
-      "description": "Configure the server application to use the Server Routing and App Engine APIs (Developer Preview).",
-      "type": "boolean"
     }
   },
   "required": ["project"]

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

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { <%= classify(name) %><%= classify(type) %> } from './<%= dasherize(name) %><%= type ? '.' + dasherize(type) : '' %>';
+
+describe('<%= classify(name) %><%= classify(type) %>', () => {
+  let service: <%= classify(name) %><%= classify(type) %>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(<%= classify(name) %><%= classify(type) %>);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

package/service/files/__name@dasherize@if-flat__/{__name@dasherize__.service.ts.template → __name@dasherize__.__type@dasherize__.ts.template}

@@ -3,7 +3,7 @@ import { Injectable } from '@angular/core';
 @Injectable({
   providedIn: 'root'
 })
-export class <%= classify(name) %>Service {
+export class <%= classify(name) %><%= classify(type) %> {
 
   constructor() { }
 }

package/service/index.js

@@ -13,6 +13,8 @@ function default_1(options) {
     // This schematic uses an older method to implement the flat option
     const flat = options.flat;
     options.flat = true;
+    // Schematic templates require a defined type value
+    options.type ??= '';
     return (0, generate_from_files_1.generateFromFiles)(options, {
         'if-flat': (s) => (flat ? '' : s),
     });

package/service/schema.d.ts

@@ -28,4 +28,9 @@ export type Schema = {
      * Skip the generation of a unit test file `spec.ts` for the service.
      */
     skipTests?: boolean;
+    /**
+     * Append a custom type to the service's filename. For example, if you set the type to
+     * `service`, the file will be named `my-service.service.ts`.
+     */
+    type?: string;
 };

package/service/schema.json

@@ -39,6 +39,10 @@
       "type": "boolean",
       "description": "Skip the generation of a unit test file `spec.ts` for the service.",
       "default": false
+    },
+    "type": {
+      "type": "string",
+      "description": "Append a custom type to the service's filename. For example, if you set the type to `service`, the file will be named `my-service.service.ts`."
     }
   },
   "required": ["name", "project"]

package/ssr/index.d.ts

@@ -7,6 +7,4 @@
  */
 import { Rule } from '@angular-devkit/schematics';
 import { Schema as SSROptions } from './schema';
-export default function (inputOptions: SSROptions): Rule;
-export type Prompt = (message: string, defaultValue: boolean) => Promise<boolean>;
-export declare function setPrompterForTestOnly(prompter?: Prompt): void;
+export default function (options: SSROptions): Rule;