Angular CLI MCP Server setup

The Angular CLI includes an experimental Model Context Protocol (MCP) server enabling AI assistants in your development environment to interact with the Angular CLI. We've included support for CLI powered code generation, adding packages, and more.

Available Tools

The Angular CLI MCP server provides several tools to assist you in your development workflow. By default, the following tools are enabled:

Name	Description	`local-only`	`read-only`
`ai_tutor`	Launches an interactive AI-powered Angular tutor. Recommended to run from a new Angular project using v20 or later. Learn more.	✅	✅
`find_examples`	Finds authoritative code examples from a curated database of official, best-practice examples, focusing on modern, new, and recently updated Angular features.	✅	✅
`get_best_practices`	Retrieves the Angular Best Practices Guide. This guide is essential for ensuring that all code adheres to modern standards, including standalone components, typed forms, and modern control flow.	✅	✅
`list_projects`	Lists the names of all applications and libraries defined within an Angular workspace. It reads the `angular.json` configuration file to identify the projects.	✅	✅
`onpush-zoneless-migration`	Analyzes Angular code and provides a step-by-step, iterative plan to migrate it to `OnPush` change detection, a prerequisite for a zoneless application.	✅	✅
`search_documentation`	Searches the official Angular documentation at https://angular.dev. This tool should be used to answer any questions about Angular, such as for APIs, tutorials, and best practices.	❌	✅

Experimental Tools

Some tools are provided in experimental / preview status since they are new or not fully tested. Enable them individually with the --experimental-tool option and use them with caution.

Name	Description	`local-only`	`read-only`
`modernize`	Performs code migrations and provides further instructions on how to modernize Angular code to align with the latest best practices and syntax. Learn more	✅	❌

Get Started

To get started, run the following command in your terminal:

ng mcp

When run from an interactive terminal, this command displays instructions on how to configure a host environment to use the MCP server. The following sections provide example configurations for several popular editors and tools.

Cursor

Create a file named .cursor/mcp.json in your project's root and add the following configuration. You can also configure it globally in ~/.cursor/mcp.json.

{  "mcpServers": {    "angular-cli": {      "command": "npx",      "args": ["-y", "@angular/cli", "mcp"]    }  }}

Firebase Studio

Create a file named .idx/mcp.json in your project's root and add the following configuration:

{  "mcpServers": {    "angular-cli": {      "command": "npx",      "args": ["-y", "@angular/cli", "mcp"]    }  }}

Gemini CLI

Create a file named .gemini/settings.json in your project's root and add the following configuration:

{  "mcpServers": {    "angular-cli": {      "command": "npx",      "args": ["-y", "@angular/cli", "mcp"]    }  }}

JetBrains IDEs

In JetBrains IDEs (like IntelliJ IDEA or WebStorm), after installing the JetBrains AI Assistant plugin, go to Settings | Tools | AI Assistant | Model Context Protocol (MCP). Add a new server and select As JSON. Paste the following configuration, which does not use a top-level property for the server list.

{  "name": "Angular CLI",  "command": "npx",  "args": [    "-y",    "@angular/cli",    "mcp"  ]}

VS Code

In your project's root, create a file named .vscode/mcp.json and add the following configuration. Note the use of the servers property.

{  "servers": {    "angular-cli": {      "command": "npx",      "args": ["-y", "@angular/cli", "mcp"]    }  }}

Other IDEs

For other IDEs, check your IDE's documentation for the proper location of the MCP configuration file (often mcp.json). The configuration should contain the following snippet.

{  "mcpServers": {    "angular-cli": {      "command": "npx",      "args": ["-y", "@angular/cli", "mcp"]    }  }}

Command Options

The mcp command can be configured with the following options passed as arguments in your IDE's MCP configuration:

Option	Type	Description	Default
`--read-only`	`boolean`	Only register tools that do not make changes to the project. Your editor or coding agent may still perform edits.	`false`
`--local-only`	`boolean`	Only register tools that do not require an internet connection. Your editor or coding agent may still send data over the network.	`false`
`--experimental-tool` `-E`	`string`	Enable an experimental tool. Separate multiple options by spaces, e.g. `-E tool_a tool_b`.

For example, to run the server in read-only mode in VS Code, you would update your mcp.json like this:

{  "servers": {    "angular-cli": {      "command": "npx",      "args": ["-y", "@angular/cli", "mcp", "--read-only"]    }  }}

Feedback and New Ideas

The Angular team welcomes your feedback on the existing MCP capabilities and any ideas you have for new tools or features. Please share your thoughts by opening an issue on the angular/angular GitHub repository.