VSCode + Claude Code 2026: Configúralo en 5 Minutos y Programa 2x Más Rápido

El cambio que nadie te cuenta

En 2026, programar sin AI assistant es como navegar con los ojos vendados. Tarde o temprano alguien te pregunta: “¿Por qué no usas IA?” y no sabés qué responder.

La diferencia ya no es si usás IA o no. La pregunta es: ¿cuál configuración te hace más rápido?

Miles de developers están migrando a esta combinación:

> VSCode + Claude Code = Potencia de IA sin salir de tu editor favorito

Te explico paso a paso cómo configurarlo y por qué vale la pena.

¿Por qué VSCode + Claude y no otra cosa?

VSCode es el editor dominante desde hace años. Tiene:

  • Millones de extensiones
  • Lo usás todos los días

Ahora agregale Claude Code: la extensión oficial de Anthropic que trae a Claude dentro de tu IDE como interfaz gráfica nativa.

¿El resultado? Potencia de coding AI sin aprender un editor nuevo, sin abandonar tus extensiones, sin rehacer tu flujo.

Qué puedes hacer con Claude Code en VSCode

La extensión de Claude Code para VSCode ofrece una interfaz gráfica integrada directamente en tu IDE.

1. Chat integrado en el sidebar

Igual que en Cursor AI o GitHub Copilot, tenés un panel de chat directamente en VSCode. Preguntás en lenguaje natural y Claude responde con código, explicaciones o análisis.

2. @-mentions con rangos de líneas

En una conversación con Claude, podés hacer referencia directa a archivos específicos de tu proyecto:

@components/Button.tsx:10-25

Esto le da a Claude contexto completo de esas líneas exactas sin tener que pedírselo manualmente.

3. Revisar y editar planes antes de aceptar

Cuando pedís algo complejo, Claude te muestra el plan primero. Vos podés editarlo, modificarlo, y recién cuando lo aprobás, ejecuta. No más ejecuciones inesperadas.

4. Auto-accept edits

Podés configurar que los cambios se acepten automáticamente a medida que Claude los hace, o revisarlos uno por uno — vos decidís el nivel de control.

5. Múltiples conversaciones en tabs

Abrís múltiples conversaciones en tabs separados o ventanas. Cada proyecto o tarea puede tener su propia sesión activa.

6. Historial de conversaciones

Accedés al historial completo de tus conversaciones para retomar donde dejaste.

7. Keyboard shortcuts

La extensión incluye atajos de teclado para invocar rápidamente a Claude sin salir del editor.

Cómo abrir Claude Code (múltiples formas)

  • Editor Toolbar — El icono Spark (⚡) aparece en la barra superior derecha del editor cuando tenés un archivo abierto
  • Status Bar — Haces clic en ✱ Claude Code en la esquina inferior derecha

Configuración paso a paso (5 minutos)

Requisitos previos

  • VS Code 1.98.0 o superior
  • Una cuenta de Anthropic (gratuitaa)

Paso 1: Instalá la extensión

Opción A: Link directo

  • [Instalar para VS Code](vscode:extension/anthropic.claude-code)
  • [Instalar para Cursor](cursor:extension/anthropic.claude-code)

Opción B: Desde VSCode

  • Press Cmd+Shift+X (Mac) o Ctrl+Shift+X (Windows/Linux)
  • Click en Install
bash
También podés instalar desde línea de comandos
code --install-extension anthropic.claude-code

Nota: Si la extensión no aparece después de instalar, reiniciá VSCode o ejecutá “Developer: Reload Window” desde la Command Palette.

Paso 2: Abrí el panel de Claude

  • Hacé clic en el icono ⚡ (Spark) en el Editor Toolbar o Activity Bar
  • Hacé clic en “Sign in” y completá la autorización en tu navegador

Tip: La extensión incluye la CLI también — podés acceder desde el terminal integrado de VSCode para features avanzados.

Paso 3: Elegí tu plan

  • Claude Pro ($20/mes): Acceso a Opus 4.7, Sonnet 4.7, límites altos de mensajes
  • Gratis: 30 mensajes al mes con Sonnet 4.6

Comparación: VSCode + Claude vs Cursor AI

Característica VSCode + Claude Cursor AI
Costo $20/mes (Pro) o API por uso $20/mes (Pro)
Extensiones VSCode ✓ Todas ✗ Limitado
IA integrada en IDE ✓ Panel lateral nativo ✓ Nativa
Autocompletado en tiempo real ✗ Solo chat bajo demanda ✓ Sí
Diffs inline ✓ Sí ✓ Sí
Plan antes de ejecutar ✓ Editable antes de aceptar ✓ Sí
Auto-accept edits ✓ Configurable ✓ Sí
@-mentions con líneas ✓ :10-25 específico ✓ Básico
Múltiples tabs de chat ✓ Sí ✓ Sí
Historial de conversaciones ✓ Completo ✓ Sí
Keyboard shortcuts ✓ Sí ✓ Sí
Disponible para Cursor ✓ Sí ✓ Nativo
Modelo Claude Sonnet 4.6/Opus 4.7 Múltiples (GPT-4o, Claude, Gemini)
Código abierto VSCode sí, Claude no Parcial

El veredicto: VSCode + Claude gana en flexibilidad, ecosistema de extensiones y features avanzados. Cursor AI gana en autocompletado en tiempo real y simplicidad. Si ya usás VSCode, esta combinación es el camino más rápido para conseguir coding AI sin cambiar tu flujo.

Casos donde funciona mejor

Desarrollo web full-stack

Claude entiende contexto de frontend y backend. Le pedís “creá un endpoint en Express que valide JWT y devuelva usuarios” y entiende el stack completo.

Code review interactivo

Le mostrás un archivo y le pedís review. Te señala problemas potenciales línea por línea con los diffs visibles.

Debugging express

Le mostrás el error y te dice: “El problema está en la línea 23, el array no está inicializado.”

Aprender código nuevo

Heredas un proyecto sin documentación. Le preguntás “explicame cómo funciona este módulo” y te lo resume en segundos.

Proyectos múltiples

Con los tabs de conversación, cada proyecto o feature tiene su propia sesión organizada.

Limitaciones conocidas

  • No es autocompletado en tiempo real — necesitás pedírle en el chat, no completa solo mientras escribís
  • VS Code 1.98.0+ requerido — si tenés una versión vieja, tenés que actualizar

Scopes de Instalación de Plugins

Cuando instalás un plugin, elegís el alcance:

  • Install for you: Disponible en todos tus proyectos (scope usuario)
  • Install locally: Solo para vos, solo en este repositorio (scope local)

Gestión de Marketplaces

En la pestaña Marketplaces podés agregar o remover fuentes de plugins:

  • Ingresá un repo de GitHub, URL, o path local para agregar un nuevo marketplace
  • Click en el ícono de trash para remover un marketplace

Nota: Después de hacer cambios, un banner te pide reiniciar Claude Code para aplicar las actualizaciones.

Importante: Los plugins y marketplaces que configures en la extensión de VSCode también están disponibles en la CLI, y viceversa.

Integración con Chrome

Conectá Claude a tu navegador Chrome para testear web apps, debuggear console logs, y automatizar flujos de navegador sin salir de VSCode.

Requisitos: [Claude in Chrome extension](https://chromewebstore.google.com/detail/claude/fcoeoabgfenejglbffodgkkbkcdhcgfn) versión 1.0.36 o superior.

Cómo usar @browser:

@browser go to localhost:3000 and check the console for errors

Claude abre nuevas pestañas para tareas del browser y comparte tu estado de login — puede acceder a cualquier sitio donde ya estés logueado.

Comandos y Shortcuts de VSCode

Abrí la Command Palette (Cmd+Shift+P en Mac o Ctrl+Shift+P en Windows/Linux) y escribí “Claude Code” para ver todos los comandos disponibles.

Focus States: Algunos shortcuts dependen de qué panel está “en foco”:

  • Cursor en archivo: El editor está en foco
  • Cursor en el prompt box: Claude está en foco

Cmd+Esc (Mac) / Ctrl+Esc (Windows/Linux) — Toggle entre editor y Claude

Tabla de Comandos y Shortcuts

Command Shortcut Description
Focus Input Cmd+Esc (Mac) / Ctrl+Esc (Windows/Linux) Toggle focus entre editor y Claude
Open in Side Bar — Abrir Claude en el sidebar izquierdo
Open in Terminal — Abrir Claude en modo terminal
Open in New Tab Cmd+Shift+Esc (Mac) / Ctrl+Shift+Esc (Windows/Linux) Nueva conversación como editor tab
Open in New Window — Nueva conversación en ventana separada
New Conversation Cmd+N (Mac) / Ctrl+N (Windows/Linux) Iniciar nueva conversación (requiere que Claude esté en foco y enableNewConversationShortcut esté activado)
Insert @-Mention Reference Option+K (Mac) / Alt+K (Windows/Linux) Insertar referencia al archivo y selección actual
Show Logs — Ver logs de debug de la extensión
Logout — Cerrar sesión de tu cuenta Anthropic

URI Handler: Abrir Claude desde Otras Herramientas

La extensión registra un URI handler en vscode://anthropic.claude-code/open. Podés usarlo para abrir una nueva tab de Claude Code desde tus propias herramientas.

Ejemplo — macOS:

open "vscode://anthropic.claude-code/open"

Linux:

xdg-open "vscode://anthropic.claude-code/open"

Windows:

start vscode://anthropic.claude-code/open

Parámetros Query Opcionales

Parameter Description
prompt Texto para pre-llenar el prompt box. Debe estar URL-encoded. El prompt se llena pero no se envía automáticamente.

Parámetro session

Parameter Description
session Session ID para reanudar en vez de iniciar nueva conversación. La sesión debe pertenecer al workspace abierto en VS Code. Si no se encuentra, inicia una conversación nueva. Si ya está abierta en un tab, hace focus en ese tab.

Ejemplo práctico:

vscode://anthropic.claude-code/open?prompt=review%20my%20changes

Abre una tab pre-llenada con “review my changes”.

Configuración de la Extensión

La extensión tiene dos tipos de settings:

1. Extension Settings (en VS Code)

Controlan el comportamiento de la extensión dentro de VS Code.

Cómo acceder:

  • Cmd+, (Mac) / Ctrl+, (Windows/Linux) → Extensions → Claude Code
  • O escribí / y seleccioná “General Config”

2. Claude Code Settings (~/.claude/settings.json)

Compartidos entre la extensión y la CLI. Usalos para:

  • Allowed commands
  • MCP servers

Tip: Agregá esto a tu settings.json para obtener autocomplete:

json
"$schema": "https://json.schemastore.org/claude-code-settings.json"

Extension Settings Tables

Extension Settings (configurables en VSCode)

Setting Default Description
useTerminal false Lanzar Claude en modo terminal en vez del panel gráfico
initialPermissionMode default Controla los prompts de aprobación para nuevas conversaciones: default, plan, acceptEdits, o bypassPermissions
preferredLocation panel Dónde abre Claude: sidebar (derecha) o panel (nuevo tab)
autosave true Auto-guardar archivos antes de que Claude los lea o escriba
useCtrlEnterToSend false Usar Ctrl+Enter en vez de Enter para enviar prompts

| enableNewConversationShortcut | false | Activar Cmd/Ctrl+N para nueva conversación | | hideOnboarding | false | Ocultar la checklist de onboarding (ícono de birrete) | | respectGitIgnore | true | Excluir patrones de .gitignore en búsquedas de archivos | | usePythonEnvironment | true | Activar el entorno Python del workspace. Requiere la extensión de Python | | environmentVariables | [] | Setear environment variables para el proceso de Claude. Usar Claude Code settings para configuración compartida | | disableLoginPrompt | false | Saltar prompts de autenticación (para configuraciones con third-party providers) | | allowDangerouslySkipPermissions | false | Agrega modo Auto y Bypass permissions al selector de modo. Auto mode tiene requisitos de plan, admin, model y provider | | claudeProcessWrapper | — | Path del ejecutable usado para lanzar el proceso de Claude |

VS Code Extension vs. CLI

Claude Code está disponible como extensión de VSCode (panel gráfico) y como CLI (command-line interface en el terminal). Algunas features solo están disponibles en la CLI. Si necesitás una feature de CLI, corré claude en el integrated terminal de VSCode.

CLI vs Extension: Comparación de Features

Feature CLI VS Code Extension
Commands and skills Todas Subset (escribí / para ver disponibles)
MCP server config Sí Parcial (agregá servers via CLI; gestioná con /mcp en el chat panel)
Checkpoints Sí Sí
! bash shortcut Sí No
Tab completion Sí No

Rewind con Checkpoints

La extensión de VSCode soporta checkpoints, que trackean los cambios de archivos de Claude y te permiten volver a un estado anterior.

Cómo funciona:

  • Hacé hover sobre cualquier mensaje
  • Fork conversation and rewind code: Ambas cosas juntas — nueva rama y revert de archivos

Run CLI en VS Code

Si necesitás una feature exclusiva de CLI, podés correr claude directamente en el integrated terminal de VSCode. La extensión y la CLI comparten el mismo contexto y autenticación.

Integración con Terminal

Para usar la CLI dentro de VSCode:

  • Abrí el integrated terminal (` Ctrl+ ` en Windows/Linux o Cmd+ ` en Mac)
  • Corré claude

La CLI se integra automáticamente con tu IDE para diff viewing y diagnostic sharing.

Desde terminal externo: Corré /ide dentro de Claude Code para conectarlo a VSCode.

Switch entre Extension y CLI

La extensión y la CLI comparten el mismo historial de conversaciones. Para continuar una conversación de la extensión en la CLI:

bash
claude --resume

Esto abre un selector interactivo para buscar y seleccionar tu conversación.

Incluir Output de Terminal en Prompts

Referenciá output del terminal en tus prompts usando @terminal:name donde name es el título del terminal. Esto te permite mostrar a Claudecommand output, errores, o logs sin copy-paste.

Monitoreo de Procesos en Background

Cuando Claude corre comandos largos, la extensión muestra progreso en el status bar. Sin embargo, la visibilidad es limitada comparada con la CLI.

Para mejor visibilidad, pedile a Claude que outputtee el comando para que puedas correrlo en el integrated terminal.

MCP (Model Context Protocol)

Los servers MCP le dan a Claude acceso a herramientas externas, bases de datos, y APIs.

Para agregar un MCP server:

bash
claude mcp add --transport http github https://api.githubcopilot.com/mcp/

Una vez configurado, pedile a Claude que use las tools (ej: "Review PR #456").

Gestión sin salir de VSCode: Escribí /mcp en el chat panel. El diálogo de gestión MCP te permite:

  • Enable/disable servers
  • Gestionar OAuth authentication

Trabajo con Git

Claude Code se integra con git para ayudarte con workflows de version control directamente en VSCode.

Commits y Pull Requests

Claude puede stagear cambios, escribir commit messages, y crear PRs:

commit my changes with a descriptive message
create a pr for this feature
summarize the changes I've made to the auth module

Cuando crea PRs, Claude genera descripciones basadas en los cambios reales del código y puede agregar contexto sobre testing o decisiones de implementación.

Git Worktrees para Tareas Paralelas

Empezá hoy

  • Actualizá VSCode a la última versión (1.98.0+)
  • Empezá a chatear

5 minutos de configuración. Potencial de duplicar tu velocidad de coding.

*Artículo actualizado: abril 2026*