@angular/cli 20.1.0-rc.0 → 20.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4299,7 +4299,7 @@
4299
4299
  },
4300
4300
  "watch": {
4301
4301
  "type": "boolean",
4302
- "description": "Run build when files change."
4302
+ "description": "Re-run tests when source files change. Defaults to `true` in TTY environments and `false` otherwise."
4303
4303
  },
4304
4304
  "debug": {
4305
4305
  "type": "boolean",
@@ -4354,6 +4354,13 @@
4354
4354
  "type": "string",
4355
4355
  "description": "TypeScript file that exports an array of Angular providers to use during test execution. The array must be a default export.",
4356
4356
  "minLength": 1
4357
+ },
4358
+ "setupFiles": {
4359
+ "type": "array",
4360
+ "items": {
4361
+ "type": "string"
4362
+ },
4363
+ "description": "A list of global setup and configuration files that are included before the test files. The application's polyfills are always included before these files. The Angular Testbed is also initialized prior to the execution of these files."
4357
4364
  }
4358
4365
  },
4359
4366
  "additionalProperties": false,
@@ -4616,7 +4623,8 @@
4616
4623
  },
4617
4624
  "watch": {
4618
4625
  "type": "boolean",
4619
- "description": "Run build when files change."
4626
+ "description": "Re-run tests when source files change.",
4627
+ "default": true
4620
4628
  },
4621
4629
  "poll": {
4622
4630
  "type": "number",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@angular/cli",
3
- "version": "20.1.0-rc.0",
3
+ "version": "20.1.0",
4
4
  "description": "CLI tool for Angular",
5
5
  "main": "lib/cli/index.js",
6
6
  "bin": {
@@ -25,13 +25,13 @@
25
25
  },
26
26
  "homepage": "https://github.com/angular/angular-cli",
27
27
  "dependencies": {
28
- "@angular-devkit/architect": "0.2001.0-rc.0",
29
- "@angular-devkit/core": "20.1.0-rc.0",
30
- "@angular-devkit/schematics": "20.1.0-rc.0",
28
+ "@angular-devkit/architect": "0.2001.0",
29
+ "@angular-devkit/core": "20.1.0",
30
+ "@angular-devkit/schematics": "20.1.0",
31
31
  "@inquirer/prompts": "7.6.0",
32
32
  "@listr2/prompt-adapter-inquirer": "2.0.22",
33
33
  "@modelcontextprotocol/sdk": "1.13.3",
34
- "@schematics/angular": "20.1.0-rc.0",
34
+ "@schematics/angular": "20.1.0",
35
35
  "@yarnpkg/lockfile": "1.1.0",
36
36
  "ini": "5.0.0",
37
37
  "jsonc-parser": "3.3.1",
@@ -41,19 +41,20 @@
41
41
  "pacote": "21.0.0",
42
42
  "resolve": "1.22.10",
43
43
  "semver": "7.7.2",
44
- "yargs": "18.0.0"
44
+ "yargs": "18.0.0",
45
+ "zod": "3.25.75"
45
46
  },
46
47
  "ng-update": {
47
48
  "migrations": "@schematics/angular/migrations/migration-collection.json",
48
49
  "packageGroup": {
49
- "@angular/cli": "20.1.0-rc.0",
50
- "@angular/build": "20.1.0-rc.0",
51
- "@angular/ssr": "20.1.0-rc.0",
52
- "@angular-devkit/architect": "0.2001.0-rc.0",
53
- "@angular-devkit/build-angular": "20.1.0-rc.0",
54
- "@angular-devkit/build-webpack": "0.2001.0-rc.0",
55
- "@angular-devkit/core": "20.1.0-rc.0",
56
- "@angular-devkit/schematics": "20.1.0-rc.0"
50
+ "@angular/cli": "20.1.0",
51
+ "@angular/build": "20.1.0",
52
+ "@angular/ssr": "20.1.0",
53
+ "@angular-devkit/architect": "0.2001.0",
54
+ "@angular-devkit/build-angular": "20.1.0",
55
+ "@angular-devkit/build-webpack": "0.2001.0",
56
+ "@angular-devkit/core": "20.1.0",
57
+ "@angular-devkit/schematics": "20.1.0"
57
58
  }
58
59
  },
59
60
  "packageManager": "pnpm@9.15.9",
@@ -0,0 +1,60 @@
1
+ # Angular Component Generation Prompt
2
+
3
+ ## Role and Goal
4
+
5
+ You are an expert Angular developer specializing in creating modern, high-quality components. Your goal is to generate a new Angular component based on user requirements, ensuring it follows the latest best practices and style guidelines.
6
+
7
+ ## Context
8
+
9
+ You are operating within an existing Angular CLI project. You have access to the project's file system and can use tools to interact with the Angular CLI for code generation.
10
+
11
+ ## Instructions
12
+
13
+ Follow these steps to fulfill the user's request:
14
+
15
+ ### 1. Analyze the User's Request
16
+
17
+ Carefully analyze the user's instructions to extract the following details:
18
+
19
+ - **Component Name:** The desired name for the component (e.g., 'UserProfile', 'LoginFormComponent'). Use this to form the file name and selector.
20
+ - **Inputs/Outputs:** Any `input()` or `output()` properties the component needs.
21
+ - **Component Logic:** The business logic, properties, and methods to be implemented in the component's class.
22
+ - **Template Structure:** The HTML structure for the component's template.
23
+ - **Styling:** Any CSS styles or style requirements for the component.
24
+ - **CLI Options:** Any specific options for the `ng generate` command, such as `--style=scss`, `--skip-tests=true`, `--view-encapsulation=Emulated`, etc.
25
+
26
+ ### 2. Generate the Base Component
27
+
28
+ You MUST generate the initial component files using the Angular CLI. Use the following methods in order of preference:
29
+
30
+ **Preference 1: Use the `generate_component` tool (if available)**
31
+
32
+ - This is the preferred method.
33
+ - Use the details extracted from the user's request to provide the necessary parameters.
34
+ - Always generate a **standalone** component unless explicitly told otherwise.
35
+
36
+ **Preference 2: Use the `run_shell_command` tool**
37
+
38
+ - If a dedicated `generate_component` tool is not available, fall back to using the shell command.
39
+ - Construct the command like this: `ng generate component <component-name> [options...]`
40
+ - **Default Options:** Always include `--standalone` to create a standalone component.
41
+ - **User-Defined Options:** Add any other options derived from the user's request.
42
+
43
+ ### 3. Read the Generated Files
44
+
45
+ After the CLI has generated the base files, use the `read_file` tool to get the content of the newly created:
46
+ - Component TypeScript file (`<component-name>.component.ts`)
47
+ - Component template file (`<component-name>.component.html`)
48
+ - Component stylesheet (`<component-name>.component.css`, etc.)
49
+
50
+ ### 4. Modify the Code
51
+
52
+ Modify the code from the generated files to implement the specific logic, template, and styling from the user's instructions. Ensure the final code is complete, correct, and adheres to the latest Angular best practices.
53
+
54
+ - **Class:** Add the required properties, `input()`/`output()` functions, methods, and other logic to the component's class.
55
+ - **Template:** Build the HTML structure in the template file. Use native control flow (`@if`, `@for`, `@switch`) instead of structural directives (`*ngIf`, `*ngFor`).
56
+ - **Stylesheet:** Add the necessary styles to the stylesheet.
57
+
58
+ ### 5. Final Output
59
+
60
+ Present the complete, final code for each modified file. Do not show diffs or partial code snippets. The user should be able to copy and paste the code directly into their project.
@@ -14,6 +14,7 @@ exports.createMcpServer = createMcpServer;
14
14
  const mcp_js_1 = require("@modelcontextprotocol/sdk/server/mcp.js");
15
15
  const promises_1 = require("node:fs/promises");
16
16
  const node_path_1 = __importDefault(require("node:path"));
17
+ const zod_1 = require("zod");
17
18
  const version_1 = require("../../utilities/version");
18
19
  async function createMcpServer(context) {
19
20
  const server = new mcp_js_1.McpServer({
@@ -25,36 +26,80 @@ async function createMcpServer(context) {
25
26
  },
26
27
  });
27
28
  server.registerResource('instructions', 'instructions://best-practices', {
28
- title: 'Angular System Instructions',
29
- description: 'A set of instructions to help LLMs generate correct code that follows Angular best practices.',
29
+ title: 'Angular Best Practices and Code Generation Guide',
30
+ description: "A comprehensive guide detailing Angular's best practices for code generation and development." +
31
+ ' This guide should be used as a reference by an LLM to ensure any generated code' +
32
+ ' adheres to modern Angular standards, including the use of standalone components,' +
33
+ ' typed forms, modern control flow syntax, and other current conventions.',
30
34
  mimeType: 'text/markdown',
31
35
  }, async () => {
32
36
  const text = await (0, promises_1.readFile)(node_path_1.default.join(__dirname, 'instructions', 'best-practices.md'), 'utf-8');
33
37
  return { contents: [{ uri: 'instructions://best-practices', text }] };
34
38
  });
35
39
  server.registerTool('list_projects', {
36
- title: 'List projects',
37
- description: 'List projects within an Angular workspace.' +
38
- ' This information is read from the `angular.json` file at the root path of the Angular workspace',
39
- }, () => {
40
- if (!context.workspace) {
40
+ title: 'List Angular Projects',
41
+ description: 'Lists the names of all applications and libraries defined within an Angular workspace. ' +
42
+ 'It reads the `angular.json` configuration file to identify the projects. ',
43
+ annotations: {
44
+ readOnlyHint: true,
45
+ },
46
+ outputSchema: {
47
+ projects: zod_1.z.array(zod_1.z.object({
48
+ name: zod_1.z
49
+ .string()
50
+ .describe('The name of the project, as defined in the `angular.json` file.'),
51
+ type: zod_1.z
52
+ .enum(['application', 'library'])
53
+ .optional()
54
+ .describe(`The type of the project, either 'application' or 'library'.`),
55
+ root: zod_1.z
56
+ .string()
57
+ .describe('The root directory of the project, relative to the workspace root.'),
58
+ sourceRoot: zod_1.z
59
+ .string()
60
+ .describe(`The root directory of the project's source files, relative to the workspace root.`),
61
+ selectorPrefix: zod_1.z
62
+ .string()
63
+ .optional()
64
+ .describe('The prefix to use for component selectors.' +
65
+ ` For example, a prefix of 'app' would result in selectors like '<app-my-component>'.`),
66
+ })),
67
+ },
68
+ }, async () => {
69
+ const { workspace } = context;
70
+ if (!workspace) {
41
71
  return {
42
72
  content: [
43
73
  {
44
74
  type: 'text',
45
- text: 'Not within an Angular project.',
75
+ text: 'No Angular workspace found.' +
76
+ ' An `angular.json` file, which marks the root of a workspace,' +
77
+ ' could not be located in the current directory or any of its parent directories.',
46
78
  },
47
79
  ],
48
80
  };
49
81
  }
82
+ const projects = [];
83
+ // Convert to output format
84
+ for (const [name, project] of workspace.projects.entries()) {
85
+ projects.push({
86
+ name,
87
+ type: project.extensions['projectType'],
88
+ root: project.root,
89
+ sourceRoot: project.sourceRoot ?? node_path_1.default.posix.join(project.root, 'src'),
90
+ selectorPrefix: project.extensions['prefix'],
91
+ });
92
+ }
93
+ // The structuredContent field is newer and may not be supported by all hosts.
94
+ // A text representation of the content is also provided for compatibility.
50
95
  return {
51
96
  content: [
52
97
  {
53
98
  type: 'text',
54
- text: 'Projects in the Angular workspace: ' +
55
- [...context.workspace.projects.keys()].join(','),
99
+ text: `Projects in the Angular workspace:\n${JSON.stringify(projects)}`,
56
100
  },
57
101
  ],
102
+ structuredContent: { projects },
58
103
  };
59
104
  });
60
105
  return server;
@@ -22,4 +22,4 @@ class Version {
22
22
  this.patch = patch;
23
23
  }
24
24
  }
25
- exports.VERSION = new Version('20.1.0-rc.0');
25
+ exports.VERSION = new Version('20.1.0');