mcp-angular-cli
Angular CLI MCP 服务器
提供 Angular CLI 和工作区自动化功能的模型上下文协议 (MLM) 服务器。该服务器使 LLM 和代理能够通过 Angular CLI 与 Angular 项目交互、生成组件/服务、添加软件包、创建新工作区以及运行自定义架构目标。
特征
运行
ng generate来搭建 Angular 工件(组件、服务等)运行
ng add将包添加到 Angular 工作区运行
ng new来创建新的 Angular 工作区运行
ng run来执行自定义架构师目标运行
ng update来更新 Angular 包和依赖项全部通过模型上下文协议 (MCP) 实现代理/LLM 集成
Related MCP server: Clockify MCP
安装
您可以使用 npm 全局安装该包:
npm install -g @talzach/mcp-angular-cli或者在您的项目中本地使用它:
npm install --save-dev @talzach/mcp-angular-cli用法
您可以直接运行服务器:
npx @talzach/mcp-angular-cli或者,如果您想将其用作代理或工具中的自定义 MCP 服务器,请按如下方式配置它:
MCP 配置示例
{
"mcpServers": {
"angular-cli": {
"command": "npx",
"args": ["-y", "@talzach/mcp-angular-cli"]
}
}
}工具使用示例
生成组件:
{ "schematic": "component", "name": "my-component", "appRoot": "/absolute/path/to/your/angular/project" }添加包:
{ "package": "@angular/material", "appRoot": "/absolute/path/to/your/angular/project" }创建新工作区:
{ "name": "my-workspace", "directory": "/absolute/path/to/where/you/want/it" }运行自定义架构师目标:
{ "target": "app:build:production", "appRoot": "/absolute/path/to/your/angular/project" }
如果您发现它有用,请为该 repo 加星标!
发布到 npm
要将此包的新版本发布到 npm,请运行:
npm run publish-npm这将自动构建项目并将其发布为公共包。
发展
如果您想在本地测试或开发此服务器,则需要将 MCP 服务器配置指向本地构建输出。构建项目后(例如,使用npm run build ),请将 MCP 服务器文件(例如.mcp.json或类似文件)设置为使用本地dist/index.js文件:
{
"angular-cli": {
"command": "node",
"args": ["/path/to/your/mcp-angular-cli/dist/index.js"]
}
}Available Tools
5 toolsng_addC
Run 'ng add' to add a package to the Angular workspace
| Name | Required | Description | Default |
|---|---|---|---|
| package | Yes | The npm package to add (e.g., @angular/material) | |
| appRoot | Yes | The absolute path to the first folder in the 'path' property. For example, if 'path' is 'webui/src/app/modules/alerts', then 'appRoot' should be the absolute path to 'webui'. | |
| options | No | Additional options for ng add |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It states the tool runs 'ng add' to add a package, implying a mutation operation that modifies the Angular workspace. However, it doesn't disclose critical behavioral traits such as whether it requires specific permissions, what side effects occur (e.g., changes to configuration files), error handling, or any rate limits. This is a significant gap for a mutation tool with zero annotation coverage.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is extremely concise and front-loaded, consisting of a single sentence that directly states the tool's purpose without any unnecessary words. Every part of the sentence earns its place by clearly conveying the action and target, making it efficient and easy to understand at a glance.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity of a mutation tool that modifies an Angular workspace, the description is incomplete. No annotations are provided to cover safety or behavioral aspects, and there's no output schema to explain return values. The description lacks details on what happens after execution (e.g., success indicators, error messages), making it inadequate for the tool's context despite the concise purpose statement.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 100% description coverage, providing clear documentation for all parameters ('package', 'appRoot', 'options'). The description adds no additional meaning beyond what the schema already specifies, as it doesn't elaborate on parameter usage, examples, or constraints. With high schema coverage, the baseline score of 3 is appropriate, as the description doesn't compensate but also doesn't detract.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose: 'Run 'ng add' to add a package to the Angular workspace.' It specifies the verb ('add') and resource ('package to the Angular workspace'), making the action clear. However, it doesn't explicitly differentiate from sibling tools like 'ng_update' (which might update packages) or 'ng_generate' (which creates components), leaving some ambiguity in sibling differentiation.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives. It doesn't mention when to choose 'ng_add' over sibling tools like 'ng_update' for package management or 'ng_generate' for adding components, nor does it specify prerequisites or exclusions. This lack of contextual usage information leaves the agent without clear direction.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
ng_generateC
Run 'ng generate' to create a new Angular artifact (component, service, etc.)
| Name | Required | Description | Default |
|---|---|---|---|
| schematic | Yes | The schematic to generate (e.g., component, service) | |
| name | Yes | The name of the artifact to generate | |
| path | No | The path where the artifact should be created, relative to the appRoot (do not include the app folder itself). For example, if the full path is 'webui/src/app/modules/alerts' and appRoot is 'webui', then path should be 'src/app/modules/alerts'. | src/app |
| appRoot | Yes | The absolute path to the first folder in the 'path' property. For example, if 'path' is 'webui/src/app/modules/alerts', then 'appRoot' should be the absolute path to 'webui'. | |
| options | No | Additional options for the schematic |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden. It mentions creating artifacts but lacks details on permissions, side effects (e.g., file system changes), error handling, or output format. For a tool that likely modifies files, this is a significant gap in behavioral disclosure.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that front-loads the core action and purpose without any wasted words. It directly communicates the tool's function in a structured and clear manner.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's complexity (5 parameters, nested objects, no output schema, and no annotations), the description is insufficient. It doesn't explain what happens after generation, error cases, or the impact of options like 'force' or 'dryRun', leaving critical context gaps for a file-creating tool.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100%, so the schema fully documents all 5 parameters. The description adds no additional meaning beyond implying 'schematic' and 'name' are used for artifact generation, but it doesn't clarify parameter interactions or usage beyond what the schema provides, meeting the baseline for high coverage.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the verb ('Run ng generate') and resource ('to create a new Angular artifact'), specifying examples like component and service. It distinguishes from siblings like ng_add or ng_new by focusing on artifact generation rather than adding packages or creating new projects, though it doesn't explicitly contrast them.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives like ng_add or ng_new, nor does it mention prerequisites or context for generating artifacts. It simply states what the tool does without indicating appropriate scenarios or exclusions.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
ng_newC
Run 'ng new' to create a new Angular workspace
| Name | Required | Description | Default |
|---|---|---|---|
| name | Yes | The name of the new workspace | |
| directory | No | The directory to create the workspace in | |
| appRoot | No | The absolute path to the first folder in the 'path' property. For example, if 'path' is 'webui/src/app/modules/alerts', then 'appRoot' should be the absolute path to 'webui'. | |
| options | No | Additional options for ng new |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It mentions the tool creates a new workspace, implying a write operation, but doesn't cover critical aspects like side effects (e.g., file system changes), permissions needed, error handling, or output format. This leaves significant gaps for an agent to understand the tool's behavior.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that directly states the tool's purpose without any wasted words. It is appropriately sized and front-loaded, making it easy for an agent to parse quickly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's complexity (creates a new Angular workspace with 4 parameters), lack of annotations, and no output schema, the description is insufficient. It doesn't explain what the tool returns, potential side effects, or how it interacts with the system, leaving the agent with incomplete information for safe and effective use.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The schema description coverage is 100%, with all parameters well-documented in the input schema. The description adds no additional parameter semantics beyond what's in the schema, such as examples or constraints. Since the schema does the heavy lifting, the baseline score of 3 is appropriate.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action ('Run ng new') and the outcome ('create a new Angular workspace'), providing a specific verb and resource. However, it doesn't differentiate this tool from its siblings (e.g., ng_add, ng_generate), which might also create or modify Angular projects in different ways, so it doesn't reach the highest score.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives like ng_add or ng_generate, nor does it mention prerequisites or exclusions. It simply states what the tool does without contextual usage information.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
ng_runC
Run 'ng run' to execute a custom architect target
| Name | Required | Description | Default |
|---|---|---|---|
| target | Yes | The target to run (e.g., app:build:production) | |
| appRoot | Yes | The absolute path to the first folder in the 'path' property. For example, if 'path' is 'webui/src/app/modules/alerts', then 'appRoot' should be the absolute path to 'webui'. | |
| options | No | Additional options for ng run |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It mentions execution but doesn't clarify if this is a read-only or destructive operation, what permissions are needed, or any side effects like file modifications. This is inadequate for a tool that likely performs builds or similar actions.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that directly states the tool's function without unnecessary words. It's front-loaded and appropriately sized for its purpose, earning full marks for conciseness.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity of executing custom architect targets (likely involving builds or deployments), no annotations, and no output schema, the description is insufficient. It doesn't explain what happens during execution, potential outputs, or error handling, leaving significant gaps for the agent.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100%, so the schema already documents all parameters thoroughly. The description adds no additional meaning beyond implying 'ng run' execution, which is redundant with the tool name. Baseline 3 is appropriate as the schema does the heavy lifting.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action ('Run') and resource ('custom architect target'), making the purpose understandable. However, it doesn't differentiate from sibling tools like ng_generate or ng_update, which also execute Angular CLI commands, so it doesn't reach the highest clarity level.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
No guidance is provided on when to use this tool versus alternatives like ng_generate or ng_add. The description merely states what it does without context about appropriate scenarios or prerequisites, leaving the agent to infer usage.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
ng_updateC
Run 'ng update' to update Angular packages and run migrations.
| Name | Required | Description | Default |
|---|---|---|---|
| packages | Yes | ||
| appRoot | Yes | The absolute path to the first folder in the 'path' property. For example, if 'path' is 'webui/src/app/modules/alerts', then 'appRoot' should be the absolute path to 'webui'. | |
| next | No | Use the prerelease version, including beta and RCs. | |
| force | No | Ignore peer dependency version mismatches. | |
| allowDirty | No | Allow updating when the repository contains modified or untracked files. | |
| createCommits | No | Create source control commits for updates and migrations. | |
| from | No | Version from which to migrate from (only with migrate-only and single package). | |
| to | No | Version up to which to apply migrations (only with migrate-only and single package). | |
| migrateOnly | No | Only perform a migration, do not update the installed version. | |
| name | No | The name of the migration to run (only with migrate-only and single package). | |
| verbose | No | Display additional details about internal operations during execution. |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries full burden for behavioral disclosure. It mentions that the tool 'updates Angular packages and run migrations' which implies mutation/write operations, but doesn't disclose important behavioral aspects like whether this modifies project files, requires specific permissions, has side effects, or what happens on failure. For a complex update tool with 11 parameters, this is inadequate.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is extremely concise - a single sentence that directly states the tool's purpose without any fluff or unnecessary elaboration. It's front-loaded with the core functionality and wastes no words.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a complex Angular update tool with 11 parameters, no annotations, and no output schema, the description is insufficient. It doesn't explain what 'run migrations' entails, what gets modified, potential risks, or typical use cases. The combination of high complexity and minimal description creates significant gaps for an AI agent.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The description provides no parameter-specific information, but with 91% schema description coverage, the input schema already documents most parameters well. The baseline score of 3 is appropriate since the schema does the heavy lifting, though the description adds no value beyond what's in the structured schema.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the action ('Run ng update') and purpose ('to update Angular packages and run migrations'), providing a specific verb+resource combination. It doesn't explicitly differentiate from sibling tools like ng_add or ng_generate, but the focus on updating packages is reasonably distinct from adding packages or generating code.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives like ng_add or ng_generate, nor does it mention prerequisites or typical contexts for running Angular updates. It simply states what the tool does without usage context.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
5 tool updates
- First observed
ng_add - First observed
ng_generate - First observed
ng_new - First observed
ng_run - First observed
ng_update
TDQS
Scored across 5 tools
Each tool has a clearly distinct purpose corresponding to a specific Angular CLI command: ng_new creates workspaces, ng_add adds packages, ng_generate creates artifacts, ng_run executes targets, and ng_update updates packages. There is no overlap or ambiguity between these functions.
All tool names follow a consistent 'ng_' prefix pattern with a verb suffix (add, generate, new, run, update), using snake_case uniformly. This predictable naming makes it easy to identify and select the correct tool.
With 5 tools, the server is well-scoped for its purpose of exposing key Angular CLI commands. It covers essential operations, though it might be slightly thin if advanced CLI features are excluded, but it's reasonable for core workflows.
The tool set covers major Angular CLI operations: creating workspaces, adding packages, generating artifacts, running targets, and updating packages. Minor gaps may exist, such as missing build or serve commands, but core lifecycle tasks are well-represented.
Maintenance
Related MCP Connectors
A Model Context Protocol server for Wix AI tools
Model Context Protocol server for Studex tools, notifications, and profile integrations
A Model Context Protocol (MCP) server for Selise Blocks Cloud integration
Model Context Protocol server for todo.vu task management and time tracking.
Related MCP Servers
- -
- AlicenseBqualityFmaintenanceClockify Model Context Protocol (MCP) server1714MIT
- -
- AlicenseNot gradedqualityBmaintenanceA Model Context Protocol server that provides Angular project analysis and refactoring capabilities, enabling LLMs to analyze component usage patterns, dependency structures, and perform safe refactoring with breaking change detection.4MIT