Claude Code pour VS Code

✓ Officiel

L'extension IDE officielle d'Anthropic : panneau latéral avec diffs en ligne — Claude Code de façon visuelle directement dans VS Code plutôt que dans le seul terminal.

Claude Code pour VS Code est l'extension officielle d'Anthropic qui apporte la CLI Claude Code sous forme de panneau graphique directement dans l'éditeur. Après connexion (compte Pro, Max, Team ou Enterprise, aucune clé API nécessaire), un serveur MCP local nommé « ide » tourne en arrière-plan : il se lie à 127.0.0.1 sur un port aléatoire, sécurise chaque connexion avec un token d'authentification généré à la volée, et fournit à la CLI deux outils — l'un lit les diagnostics du panneau Problems de VS Code, l'autre exécute du code dans un kernel Jupyter actif (toujours avec une boîte de dialogue de confirmation). Claude voit en outre automatiquement votre sélection de texte et le chemin du fichier ouvert comme contexte.

Lorsque Claude propose une modification, une vue de diff côte à côte s'ouvre, que vous pouvez accepter, rejeter ou retravailler directement. Trois modes de permission déterminent la liberté accordée à Claude : Manual (demande avant chaque modification), Plan (affiche d'abord le plan sous forme de document Markdown à commenter) et Edit automatically. Le panneau peut être déplacé librement dans la barre latérale, un onglet d'éditeur ou une fenêtre séparée, plusieurs conversations parallèles sont possibles, et via /mcp vous gérez les serveurs MCP externes préalablement ajoutés via la CLI avec claude mcp add. Avec l'extension Claude in Chrome installée, le panneau peut en outre piloter le navigateur (@browser ...). Selon le VS Code Marketplace, l'extension totalise désormais plus de 20 millions d'installations.

🔧 SETUP

Vérifier la version de VS Code (1.98.0 minimum requis)
Installer l'extension : Ctrl+Shift+X (Cmd+Shift+X sur Mac) ouvre la vue Extensions, rechercher « Claude Code » et cliquer sur Install — ou directement via le lien vscode:extension/anthropic.claude-code
Lors de la première ouverture du panneau, cliquer sur « Sign in » et terminer l'autorisation dans le navigateur (un compte Pro/Max/Team/Enterprise suffit, aucune clé API nécessaire)
Ouvrir le panneau via l'icône Spark dans la barre d'outils de l'éditeur (apparaît lorsqu'un fichier est ouvert) et envoyer un prompt
En option : ajouter des serveurs MCP dans le terminal intégré avec `claude mcp add`, puis les gérer dans le panneau via `/mcp`

✅ QUAND L’UTILISER ?

Corrections rapides de bugs dans son éditeur habituel

Vous sélectionnez une fonction défaillante, appuyez sur Alt+K, décrivez le bug — Claude voit automatiquement votre sélection et propose une modification en diff intégré, que vous acceptez ou rejetez directement.

Construire un frontend et le vérifier dans le navigateur

Avec l'extension Claude in Chrome installée, vous tapez dans le panneau `@browser go to localhost:3000 and check the console for errors` — Claude teste immédiatement sa propre modification en direct, sans que vous quittiez l'éditeur.

⛔ QUAND ÉVITER ?

Fonctionnalités réservées à la CLI manquantes

Le raccourci bash `!`, la complétion par tabulation et certaines commandes slash ne sont, selon la documentation, disponibles que dans la CLI en terminal, pas intégralement dans le panneau VS Code.

Mieux: Pour disposer de toutes les fonctionnalités, installer en plus la CLI Claude Code séparément et la lancer avec `claude` dans le terminal intégré.

Aucun ajout automatique au PATH

L'extension embarque sa propre copie de la CLI pour le panneau, mais ne place pas `claude` dans le PATH du terminal.

Mieux: Effectuer séparément l'installation autonome de la CLI si `claude` doit être appelable directement dans le terminal.