Extension VS Code (Bêta)

L’extension VS Code, disponible en bêta, vous permet de voir les modifications de Claude en temps réel grâce à une interface graphique native intégrée directement dans votre IDE. L’extension VS Code facilite l’accès et l’interaction avec Claude Code pour les utilisateurs qui préfèrent une interface visuelle plutôt que le terminal.

Fonctionnalités

L’extension VS Code fournit :
  • Expérience IDE native : Panneau latéral Claude Code dédié accessible via l’icône Spark
  • Mode plan avec édition : Examinez et modifiez les plans de Claude avant de les accepter
  • Mode d’acceptation automatique des modifications : Appliquez automatiquement les modifications de Claude au fur et à mesure qu’elles sont effectuées
  • Gestion des fichiers : Mentionnez des fichiers avec @ ou joignez des fichiers et des images en utilisant le sélecteur de fichiers système
  • Utilisation du serveur MCP : Utilisez les serveurs Model Context Protocol configurés via le CLI
  • Historique des conversations : Accès facile aux conversations passées
  • Sessions multiples : Exécutez plusieurs sessions Claude Code simultanément
  • Raccourcis clavier : Support de la plupart des raccourcis du CLI
  • Commandes slash : Accédez à la plupart des commandes slash du CLI directement dans l’extension

Exigences

  • VS Code 1.98.0 ou supérieur

Installation

Téléchargez et installez l’extension depuis le Visual Studio Code Extension Marketplace.

Mise à jour

Pour mettre à jour l’extension VS Code :
  1. Ouvrez la palette de commandes VS Code avec Cmd+Shift+P (Mac) ou Ctrl+Shift+P (Windows/Linux)
  2. Recherchez “Claude Code: Update”
  3. Sélectionnez la commande pour mettre à jour vers la dernière version

Comment ça fonctionne

Une fois installé, vous pouvez commencer à utiliser Claude Code via l’interface VS Code :
  1. Cliquez sur l’icône Spark dans la barre latérale de votre éditeur pour ouvrir le panneau Claude Code
  2. Sollicitez Claude Code de la même manière que vous le feriez dans le terminal
  3. Regardez Claude analyser votre code et suggérer des modifications
  4. Examinez et acceptez les modifications directement dans l’interface
    • Astuce : Élargissez la barre latérale pour voir les différences en ligne, puis cliquez dessus pour les développer et obtenir tous les détails

Pas encore implémenté

Les fonctionnalités suivantes ne sont pas encore disponibles dans l’extension VS Code :
  • Configuration complète du serveur MCP : Vous devez d’abord configurer les serveurs MCP via le CLI, puis l’extension les utilisera
  • Configuration des sous-agents : Configurez les sous-agents via le CLI pour les utiliser dans VS Code
  • Points de contrôle : Sauvegardez et restaurez l’état de conversation à des points spécifiques
  • Raccourcis avancés :
    • Raccourci # pour ajouter à la mémoire
    • Raccourci ! pour exécuter directement les commandes bash
  • Complétion par tabulation : Complétion du chemin de fichier avec la touche tab
Nous travaillons à l’ajout de ces fonctionnalités dans les futures mises à jour.

Considérations de sécurité

Lorsque Claude Code s’exécute dans VS Code avec les permissions d’auto-édition activées, il peut être capable de modifier les fichiers de configuration de l’IDE qui peuvent être automatiquement exécutés par votre IDE. Cela peut augmenter le risque d’exécuter Claude Code en mode auto-édition et permettre de contourner les invites de permission de Claude Code pour l’exécution bash. Lors de l’exécution dans VS Code, considérez :
  • Activer le Mode Restreint VS Code pour les espaces de travail non fiables
  • Utiliser le mode d’approbation manuelle pour les modifications
  • Prendre des précautions supplémentaires pour s’assurer que Claude n’est utilisé qu’avec des invites fiables

Intégration CLI héritée

La première intégration VS Code que nous avons publiée permet à Claude Code s’exécutant dans le terminal d’interagir avec votre IDE. Elle fournit le partage de contexte de sélection (la sélection/l’onglet actuel est automatiquement partagé avec Claude Code), la visualisation des différences dans l’IDE au lieu du terminal, les raccourcis de référence de fichier (Cmd+Option+K sur Mac ou Alt+Ctrl+K sur Windows/Linux pour insérer des références de fichier comme @File#L1-99), et le partage automatique de diagnostics (erreurs de lint et de syntaxe). L’intégration héritée s’auto-installe lorsque vous exécutez claude depuis le terminal intégré de VS Code. Exécutez simplement claude depuis le terminal et toutes les fonctionnalités s’activent. Pour les terminaux externes, utilisez la commande /ide pour connecter Claude Code à votre instance VS Code. Pour configurer, exécutez claude, entrez /config, et définissez l’outil de différence sur auto pour la détection automatique de l’IDE. L’extension et l’intégration CLI fonctionnent toutes deux avec Visual Studio Code, Cursor, Windsurf et VSCodium.

Dépannage

L’extension ne s’installe pas

  • Assurez-vous d’avoir une version compatible de VS Code (1.85.0 ou ultérieure)
  • Vérifiez que VS Code a la permission d’installer des extensions
  • Essayez d’installer directement depuis le site web du marketplace

L’intégration héritée ne fonctionne pas

  • Assurez-vous d’exécuter Claude Code depuis le terminal intégré de VS Code
  • Assurez-vous que le CLI pour votre variante d’IDE est installé :
    • VS Code : la commande code devrait être disponible
    • Cursor : la commande cursor devrait être disponible
    • Windsurf : la commande windsurf devrait être disponible
    • VSCodium : la commande codium devrait être disponible
  • Si la commande n’est pas installée :
    1. Ouvrez la palette de commandes avec Cmd+Shift+P (Mac) ou Ctrl+Shift+P (Windows/Linux)
    2. Recherchez “Shell Command: Install ‘code’ command in PATH” (ou équivalent pour votre IDE)
Pour une aide supplémentaire, consultez notre guide de dépannage.