@schematics/angular 20.0.4 → 20.1.0-next.1

package/application/files/common-files/src/app/app.html.template

@@ -134,15 +134,11 @@
     --pill-accent: var(--bright-blue);
   }
   .pill-group .pill:nth-child(6n + 2) {
-    --pill-accent: var(--electric-violet);
-  }
-  .pill-group .pill:nth-child(6n + 3) {
     --pill-accent: var(--french-violet);
   }
-
+  .pill-group .pill:nth-child(6n + 3),
   .pill-group .pill:nth-child(6n + 4),
-  .pill-group .pill:nth-child(6n + 5),
-  .pill-group .pill:nth-child(6n + 6) {
+  .pill-group .pill:nth-child(6n + 5) {
     --pill-accent: var(--hot-red);
   }
 
@@ -229,7 +225,7 @@
           <clipPath id="a"><path fill="#fff" d="M0 0h982v239H0z" /></clipPath>
         </defs>
       </svg>
-      <h1>Hello, {{ title }}</h1>
+      <h1>Hello, {{ title() }}</h1>
       <p>Congratulations! Your app is running. 🎉</p>
     </div>
     <div class="divider" role="separator" aria-label="Divider"></div>
@@ -238,7 +234,6 @@
         @for (item of [
           { title: 'Explore the Docs', link: 'https://angular.dev' },
           { title: 'Learn with Tutorials', link: 'https://angular.dev/tutorials' },
-          { title: 'Prompt and best practices for AI', link: 'https://angular.dev/ai/develop-with-ai'},
           { title: 'CLI Docs', link: 'https://angular.dev/tools/cli' },
           { title: 'Angular Language Service', link: 'https://angular.dev/tools/language-service' },
           { title: 'Angular DevTools', link: 'https://angular.dev/tools/devtools' },

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

@@ -1,9 +1,9 @@
-import { Component } from '@angular/core';
+import { Component, signal } from '@angular/core';
 
 @Component({
   selector: '<%= selector %>',<% if(inlineTemplate) { %>
   template: `
-    <h1>Welcome to {{title}}!</h1>
+    <h1>Welcome to {{ title() }}!</h1>
 
     <% if (routing) {
      %><router-outlet /><%
@@ -15,5 +15,5 @@ import { Component } from '@angular/core';
   styleUrl: './app.<%= style %>'<% } %>
 })
 export class App {
-  protected title = '<%= name %>';
+  protected readonly title = signal('<%= name %>');
 }

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

@@ -1,11 +1,11 @@
-import { Component } from '@angular/core';<% if(routing) { %>
+import { Component, signal } from '@angular/core';<% if(routing) { %>
 import { RouterOutlet } from '@angular/router';<% } %>
 
 @Component({
   selector: '<%= selector %>',
   imports: [<% if(routing) { %>RouterOutlet<% } %>],<% if(inlineTemplate) { %>
   template: `
-    <h1>Welcome to {{title}}!</h1>
+    <h1>Welcome to {{ title() }}!</h1>
 
     <% if (routing) {
      %><router-outlet /><%
@@ -16,5 +16,5 @@ import { RouterOutlet } from '@angular/router';<% } %>
   styleUrl: './app.<%= style %>'<% } %>
 })
 export class App {
-  protected title = '<%= name %>';
+  protected readonly title = signal('<%= name %>');
 }

package/application/index.js

@@ -49,7 +49,6 @@ function default_1(options) {
                     routingScope: 'Root',
                     path: sourceDir,
                     project: options.name,
-                    typeSeparator: undefined,
                 }),
             (0, schematics_1.schematic)('component', {
                 name: 'app',

package/component/schema.d.ts

@@ -29,12 +29,12 @@ export type Schema = {
     flat?: boolean;
     /**
      * Include the component's styles directly in the `component.ts` file. By default, a
-     * separate stylesheet file (e.g., `my-component.css`) is created.
+     * separate stylesheet file (e.g., `my-component.component.css`) is created.
      */
     inlineStyle?: boolean;
     /**
      * Include the component's HTML template directly in the `component.ts` file. By default, a
-     * separate template file (e.g., `my-component.html`) is created.
+     * separate template file (e.g., `my-component.component.html`) is created.
      */
     inlineTemplate?: boolean;
     /**
@@ -45,7 +45,8 @@ export type Schema = {
     /**
      * The name for the new component. This will be used to create the component's class,
      * template, and stylesheet files. For example, if you provide `my-component`, the files
-     * will be named `my-component.ts`, `my-component.html`, and `my-component.css`.
+     * will be named `my-component.component.ts`, `my-component.component.html`, and
+     * `my-component.component.css`.
      */
     name: string;
     /**

package/component/schema.json

@@ -24,7 +24,7 @@
     },
     "name": {
       "type": "string",
-      "description": "The name for the new component. This will be used to create the component's class, template, and stylesheet files. For example, if you provide `my-component`, the files will be named `my-component.ts`, `my-component.html`, and `my-component.css`.",
+      "description": "The name for the new component. This will be used to create the component's class, template, and stylesheet files. For example, if you provide `my-component`, the files will be named `my-component.component.ts`, `my-component.component.html`, and `my-component.component.css`.",
       "$default": {
         "$source": "argv",
         "index": 0
@@ -38,14 +38,14 @@
       "alias": "b"
     },
     "inlineStyle": {
-      "description": "Include the component's styles directly in the `component.ts` file. By default, a separate stylesheet file (e.g., `my-component.css`) is created.",
+      "description": "Include the component's styles directly in the `component.ts` file. By default, a separate stylesheet file (e.g., `my-component.component.css`) is created.",
       "type": "boolean",
       "default": false,
       "alias": "s",
       "x-user-analytics": "ep.ng_inline_style"
     },
     "inlineTemplate": {
-      "description": "Include the component's HTML template directly in the `component.ts` file. By default, a separate template file (e.g., `my-component.html`) is created.",
+      "description": "Include the component's HTML template directly in the `component.ts` file. By default, a separate template file (e.g., `my-component.component.html`) is created.",
       "type": "boolean",
       "default": false,
       "alias": "t",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schematics/angular",
-  "version": "20.0.4",
+  "version": "20.1.0-next.1",
   "description": "Schematics specific to Angular",
   "homepage": "https://github.com/angular/angular-cli",
   "keywords": [
@@ -22,8 +22,8 @@
   },
   "schematics": "./collection.json",
   "dependencies": {
-    "@angular-devkit/core": "20.0.4",
-    "@angular-devkit/schematics": "20.0.4",
+    "@angular-devkit/core": "20.1.0-next.1",
+    "@angular-devkit/schematics": "20.1.0-next.1",
     "jsonc-parser": "3.3.1"
   },
   "repository": {

package/server/index.js

@@ -95,14 +95,6 @@ function updateConfigFileApplicationBuilder(options) {
 function updateTsConfigFile(tsConfigPath) {
     return (host) => {
         const json = new json_file_1.JSONFile(host, tsConfigPath);
-        // Skip adding the files entry if the server entry would already be included.
-        const include = json.get(['include']);
-        if (!Array.isArray(include) || !include.includes('src/**/*.ts')) {
-            const filesPath = ['files'];
-            const files = new Set(json.get(filesPath) ?? []);
-            files.add('src/' + serverMainEntryName);
-            json.modify(filesPath, [...files]);
-        }
         const typePath = ['compilerOptions', 'types'];
         const types = new Set(json.get(typePath) ?? []);
         types.add('node');

package/utility/latest-versions/package.json

@@ -8,7 +8,7 @@
     "@types/node": "^20.17.19",
     "browser-sync": "^3.0.0",
     "express": "^5.1.0",
-    "jasmine-core": "~5.7.0",
+    "jasmine-core": "~5.8.0",
     "jasmine-spec-reporter": "~7.0.0",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.0",

package/utility/latest-versions.js

@@ -14,9 +14,9 @@ const dependencies = require('./latest-versions/package.json')['dependencies'];
 exports.latestVersions = {
     ...dependencies,
     // As Angular CLI works with same minor versions of Angular Framework, a tilde match for the current
-    Angular: '^20.0.0',
-    NgPackagr: '^20.0.0',
-    DevkitBuildAngular: '^20.0.4',
-    AngularBuild: '^20.0.4',
-    AngularSSR: '^20.0.4',
+    Angular: '^20.1.0-next.0',
+    NgPackagr: '^20.1.0-next.0',
+    DevkitBuildAngular: '^20.1.0-next.1',
+    AngularBuild: '^20.1.0-next.1',
+    AngularSSR: '^20.1.0-next.1',
 };

package/workspace/files/package.json.template

@@ -8,16 +8,6 @@
     "watch": "ng build --watch --configuration development"<% if (!minimal) { %>,
     "test": "ng test"<% } %>
   },
-  "prettier": {
-    "overrides": [
-      {
-        "files": "*.html",
-        "options": {
-          "parser": "angular"
-        }
-      }
-    ]
-  },
   "private": true,
   "dependencies": {
     "@angular/common": "<%= latestVersions.Angular %>",