VS Code Erweiterung (Beta)

Die VS Code Erweiterung, verfügbar in der Beta-Version, ermöglicht es Ihnen, Claudes Änderungen in Echtzeit über eine native grafische Benutzeroberfläche zu sehen, die direkt in Ihre IDE integriert ist. Die VS Code Erweiterung macht es einfacher, auf Claude Code zuzugreifen und damit zu interagieren, für Benutzer, die eine visuelle Oberfläche gegenüber dem Terminal bevorzugen.

Funktionen

Die VS Code Erweiterung bietet:
  • Native IDE-Erfahrung: Dediziertes Claude Code Seitenleisten-Panel, das über das Spark-Symbol zugänglich ist
  • Planmodus mit Bearbeitung: Überprüfen und bearbeiten Sie Claudes Pläne, bevor Sie sie akzeptieren
  • Auto-Accept-Bearbeitungsmodus: Wenden Sie Claudes Änderungen automatisch an, während sie vorgenommen werden
  • Dateiverwaltung: @-erwähnen Sie Dateien oder hängen Sie Dateien und Bilder über den System-Dateiwähler an
  • MCP-Server-Nutzung: Verwenden Sie Model Context Protocol Server, die über die CLI konfiguriert wurden
  • Gesprächsverlauf: Einfacher Zugriff auf vergangene Gespräche
  • Mehrere Sitzungen: Führen Sie mehrere Claude Code Sitzungen gleichzeitig aus
  • Tastaturkürzel: Unterstützung für die meisten Tastenkürzel aus der CLI
  • Slash-Befehle: Greifen Sie direkt in der Erweiterung auf die meisten CLI-Slash-Befehle zu

Anforderungen

  • VS Code 1.98.0 oder höher

Installation

Laden Sie die Erweiterung vom Visual Studio Code Extension Marketplace herunter und installieren Sie sie.

Aktualisierung

Um die VS Code Erweiterung zu aktualisieren:
  1. Öffnen Sie die VS Code Befehlspalette mit Cmd+Shift+P (Mac) oder Ctrl+Shift+P (Windows/Linux)
  2. Suchen Sie nach “Claude Code: Update”
  3. Wählen Sie den Befehl aus, um auf die neueste Version zu aktualisieren

Wie es funktioniert

Nach der Installation können Sie Claude Code über die VS Code Benutzeroberfläche verwenden:
  1. Klicken Sie auf das Spark-Symbol in der Seitenleiste Ihres Editors, um das Claude Code Panel zu öffnen
  2. Geben Sie Claude Code Anweisungen auf die gleiche Weise wie im Terminal
  3. Beobachten Sie, wie Claude Ihren Code analysiert und Änderungen vorschlägt
  4. Überprüfen und akzeptieren Sie Bearbeitungen direkt in der Benutzeroberfläche
    • Tipp: Ziehen Sie die Seitenleiste breiter, um Inline-Diffs zu sehen, und klicken Sie dann darauf, um sie für vollständige Details zu erweitern

Noch nicht implementiert

Die folgenden Funktionen sind in der VS Code Erweiterung noch nicht verfügbar:
  • Vollständige MCP-Server-Konfiguration: Sie müssen MCP-Server zuerst über die CLI konfigurieren, dann wird die Erweiterung sie verwenden
  • Subagenten-Konfiguration: Konfigurieren Sie Subagenten über die CLI, um sie in VS Code zu verwenden
  • Checkpoints: Speichern und wiederherstellen des Gesprächszustands an bestimmten Punkten
  • Erweiterte Tastenkürzel:
    • # Tastenkürzel zum Hinzufügen zum Speicher
    • ! Tastenkürzel zum direkten Ausführen von Bash-Befehlen
  • Tab-Vervollständigung: Dateipfad-Vervollständigung mit der Tab-Taste
Wir arbeiten daran, diese Funktionen in zukünftigen Updates hinzuzufügen.

Sicherheitsüberlegungen

Wenn Claude Code in VS Code mit aktivierten Auto-Edit-Berechtigungen läuft, kann es möglicherweise IDE-Konfigurationsdateien ändern, die automatisch von Ihrer IDE ausgeführt werden können. Dies kann das Risiko beim Ausführen von Claude Code im Auto-Edit-Modus erhöhen und das Umgehen von Claude Codes Berechtigungsaufforderungen für die Bash-Ausführung ermöglichen. Beim Ausführen in VS Code sollten Sie folgendes beachten:
  • Aktivieren Sie den VS Code Restricted Mode für nicht vertrauenswürdige Arbeitsbereiche
  • Verwenden Sie den manuellen Genehmigungsmodus für Bearbeitungen
  • Seien Sie besonders vorsichtig, um sicherzustellen, dass Claude nur mit vertrauenswürdigen Anweisungen verwendet wird

Legacy CLI-Integration

Die erste VS Code Integration, die wir veröffentlicht haben, ermöglicht es Claude Code, das im Terminal läuft, mit Ihrer IDE zu interagieren. Sie bietet Auswahl-Kontext-Sharing (aktuelle Auswahl/Tab wird automatisch mit Claude Code geteilt), Diff-Anzeige in der IDE anstatt im Terminal, Dateireferenz-Tastenkürzel (Cmd+Option+K auf Mac oder Alt+Ctrl+K auf Windows/Linux zum Einfügen von Dateireferenzen wie @File#L1-99) und automatisches Diagnose-Sharing (Lint- und Syntaxfehler). Die Legacy-Integration installiert sich automatisch, wenn Sie claude aus VS Codes integriertem Terminal ausführen. Führen Sie einfach claude aus dem Terminal aus und alle Funktionen werden aktiviert. Für externe Terminals verwenden Sie den /ide Befehl, um Claude Code mit Ihrer VS Code Instanz zu verbinden. Zur Konfiguration führen Sie claude aus, geben /config ein und setzen das Diff-Tool auf auto für automatische IDE-Erkennung. Sowohl die Erweiterung als auch die CLI-Integration funktionieren mit Visual Studio Code, Cursor, Windsurf und VSCodium.

Fehlerbehebung

Erweiterung installiert sich nicht

  • Stellen Sie sicher, dass Sie eine kompatible Version von VS Code haben (1.85.0 oder später)
  • Überprüfen Sie, ob VS Code die Berechtigung hat, Erweiterungen zu installieren
  • Versuchen Sie, direkt von der Marketplace-Website zu installieren

Legacy-Integration funktioniert nicht

  • Stellen Sie sicher, dass Sie Claude Code aus VS Codes integriertem Terminal ausführen
  • Stellen Sie sicher, dass die CLI für Ihre IDE-Variante installiert ist:
    • VS Code: code Befehl sollte verfügbar sein
    • Cursor: cursor Befehl sollte verfügbar sein
    • Windsurf: windsurf Befehl sollte verfügbar sein
    • VSCodium: codium Befehl sollte verfügbar sein
  • Wenn der Befehl nicht installiert ist:
    1. Öffnen Sie die Befehlspalette mit Cmd+Shift+P (Mac) oder Ctrl+Shift+P (Windows/Linux)
    2. Suchen Sie nach “Shell Command: Install ‘code’ command in PATH” (oder Äquivalent für Ihre IDE)
Für zusätzliche Hilfe siehe unseren Fehlerbehebungsleitfaden.