The Angular CLI MCP Server: Setup, Tools, and Wiring It to Your AI Assistant

What the server actually is#

The Angular CLI MCP server is a dev-time process. It runs on your machine while you write code and exposes Angular-aware tools to a compatible AI assistant over the Model Context Protocol, the open standard Anthropic released in November 2024. The point is narrow and useful: the assistant gets a path to current Angular documentation, curated examples, and your workspace layout, so it stops generating Angular from the wrong year.

Two clarifications before the setup, because the acronym is overloaded. This is not WebMCP: WebMCP is runtime, where your shipped app exposes typed tools to a browser agent, and I keep the two apart in WebMCP vs the Angular CLI MCP server. And this is not a substitute for review: it improves the assistant's starting point, it does not approve the diff. The review side lives in Angular CLI MCP and AI-Generated Angular Code. This piece is the plumbing: how you start the server and connect a client.

Start it, then point a client at it#

There are two ways in, and you usually use both. Run ng mcp in a terminal to start the server interactively; the docs note it then prints instructions for configuring a host. The form your editor actually persists is a client config that launches the same server through npx, so the client owns the process lifecycle. The canonical invocation in that config is npx -y @angular/cli mcp.

One detail that bites people: the key name differs by client. VS Code expects a servers object; Cursor, JetBrains IDEs, the Gemini CLI, and most others expect mcpServers. Same command, same args, different wrapper key. The config below is the mcpServers shape most clients read.

# start it interactively (prints host config instructions)
ng mcp

# confirm the CLI version that ships the server
ng version

The client config shape#

This is the block a client persists. For VS Code, change the outer key from mcpServers to servers and keep everything else. The -y on npx skips the install prompt so the client can launch the server unattended.

# mcp.json
# VS Code: rename the outer key from mcpServers to servers
{
  "mcpServers": {
    "angular-cli": {
      "command": "npx",
      "args": ["-y", "@angular/cli", "mcp"]
    }
  }
}

The tools it exposes#

The server registers a default set of read-style tools and a second set, behind a flag, that can touch your project. The split matters for policy: the default tools answer questions, the experimental ones run builds and tests. The names below come straight from the official page; I am not inventing any. Treat the exact roster as version-sensitive and check it against your own CLI, since the server is still described as experimental.

Two flags shape the surface area without you hand-picking tools. --read-only registers only tools that do not change the project (the docs add the honest caveat that your editor may still perform edits on its own). --local-only registers only tools that work offline. The experimental tools are opt-in through --experimental-tool (alias -E); they are not on by default.

Wiring it to your client#

Read the row that matches your editor. Claude Code takes a CLI command and writes the server into config for you; the -- separates Claude's own flags from the command it should run, and --scope project persists it to a shared .mcp.json at the repo root instead of your personal config. Cursor and VS Code take a JSON file directly, with the wrapper-key difference noted above.

# add the Angular CLI MCP server (shared with the team)
claude mcp add angular-cli --scope project -- npx -y @angular/cli mcp

# sanity-check the CLI the server runs through
ng version

When it earns its place over a plain rules file#

The server is worth wiring up when your assistant needs live answers it cannot get from a static file: current docs for an API whose status you are unsure of, the real list of projects in a workspace, or a migration plan generated against your code. If your need is simply teaching the assistant your conventions, a rules file goes further with less moving machinery, and ng generate ai-config writes one in the format your tool already reads. I run both: the AGENTS.md file for standing rules, the MCP server for live lookups. If I had to drop one on a small project, I would keep the rules file, because a stale API suggestion is cheaper to catch in review than a missing convention is to re-explain on every prompt.