Angular CLI MCP-Server 🅰️

Ein Model Context Protocol-Server, der Angular CLI und Funktionen zur Arbeitsbereichsautomatisierung bereitstellt. Dieser Server ermöglicht LLMs und Agenten die Interaktion mit Angular-Projekten, die Generierung von Komponenten/Diensten, das Hinzufügen von Paketen, die Erstellung neuer Arbeitsbereiche und die Ausführung benutzerdefinierter Architektenziele über die Angular CLI.

Merkmale

• Führen Sie ng generate aus, um Angular-Artefakte (Komponenten, Dienste usw.) zu erstellen.

• Führen Sie ng add , um Pakete zu Ihrem Angular-Arbeitsbereich hinzuzufügen

• Führen Sie ng new aus, um neue Angular-Arbeitsbereiche zu erstellen

• Führen Sie ng run aus, um benutzerdefinierte Architektenziele auszuführen

• Führen Sie ng update aus, um Angular-Pakete und -Abhängigkeiten zu aktualisieren

• Alles über das Model Context Protocol (MCP) für die Agent/LLM-Integration

Related MCP server: vscode-mcp-server

Installation

Sie können das Paket global mit npm installieren:

npm install -g @talzach/mcp-angular-cli

Oder verwenden Sie es lokal in Ihrem Projekt:

npm install --save-dev @talzach/mcp-angular-cli

Verwendung

Sie können den Server direkt ausführen:

npx @talzach/mcp-angular-cli

Oder wenn Sie es als benutzerdefinierten MCP-Server in Ihrem Agenten oder Tool verwenden möchten, konfigurieren Sie es wie folgt:

Beispiel einer MCP-Konfiguration

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

Beispiel für die Verwendung des Tools

• Generieren Sie eine Komponente:

  {
    "schematic": "component",
    "name": "my-component",
    "appRoot": "/absolute/path/to/your/angular/project"
  }

• Fügen Sie ein Paket hinzu:

  {
    "package": "@angular/material",
    "appRoot": "/absolute/path/to/your/angular/project"
  }

• Erstellen Sie einen neuen Arbeitsbereich:

  {
    "name": "my-workspace",
    "directory": "/absolute/path/to/where/you/want/it"
  }

• Führen Sie ein benutzerdefiniertes Architektenziel aus:

  {
    "target": "app:build:production",
    "appRoot": "/absolute/path/to/your/angular/project"
  }

Markieren Sie dieses Repo mit einem Stern, wenn Sie es nützlich finden

Veröffentlichen auf npm

Um eine neue Version dieses Pakets auf npm zu veröffentlichen, führen Sie Folgendes aus:

npm run publish-npm

Dadurch wird das Projekt automatisch erstellt und als öffentliches Paket veröffentlicht.

Entwickeln

Wenn Sie diesen Server lokal testen oder entwickeln möchten, müssen Sie Ihre MCP-Serverkonfiguration auf Ihre lokale Build-Ausgabe verweisen. Nachdem Sie das Projekt erstellt haben (z. B. mit npm run build ), richten Sie Ihre MCP-Serverdatei (z. .mcp.json oder ähnlich) so ein, dass die lokale Datei dist/index.js verwendet wird:

{
  "angular-cli": {
    "command": "node",
    "args": ["/path/to/your/mcp-angular-cli/dist/index.js"]
  }
}