Objetivo del tema
Integrar Claude Code con Visual Studio Code y los IDEs de JetBrains, comprender qué contexto aporta el editor, iniciar y conectar sesiones, revisar cambios con el visor de diferencias y configurar un flujo que conserve las ventajas de la terminal sin abandonar la navegación visual.
La integración no instala un “Claude distinto”. Terminal, VS Code y JetBrains comparten el bucle agéntico, las reglas de CLAUDE.md, permisos, modelos y extensiones. El IDE añade señales que ya conoce: archivo activo, selección, diagnósticos y un visor de diferencias.
Referencias a archivos y líneas sustituyen explicaciones ambiguas como “la función de arriba”.
Los cambios se inspeccionan junto al código original y pueden revisarse por fragmento.
Errores de sintaxis, tipos y lint detectados por el IDE ayudan a dirigir la corrección.
Tests, Git y comandos siguen ejecutándose en el entorno real del proyecto.
El IDE mejora la interacción, pero no amplía automáticamente el alcance autorizado. Una carpeta abierta no equivale a permiso ilimitado: las reglas de lectura, edición, Bash y red siguen aplicándose.
| Superficie | Fortaleza | Úsala cuando |
|---|---|---|
| CLI | Composición con pipes, scripts, SSH y automatización. | Trabajas principalmente desde terminal o necesitas modo no interactivo. |
| VS Code | Panel gráfico, referencias, selección y diffs integrados. | Quieres conversar y revisar sin abandonar un editor liviano. |
| JetBrains | Diagnósticos profundos del lenguaje y visor de diff del IDE. | Tu flujo depende de IntelliJ, PyCharm, WebStorm, Android Studio u otro IDE de la familia. |
| Desktop | Sesiones paralelas, paneles, vista previa y entornos locales o remotos. | Quieres coordinar varias tareas visualmente; no es un plugin del IDE. |
Puedes combinar superficies. Una sesión iniciada en la terminal integrada recibe el contexto del IDE; una terminal externa puede conectarse con /ide. Evita dos sesiones editando los mismos archivos simultáneamente, salvo que estén aisladas mediante ramas o worktrees.
Abre Extensions con Ctrl+Shift+X (Windows/Linux) o Cmd+Shift+X (macOS), busca Claude Code, comprueba que el publicador sea Anthropic e instala la extensión oficial. Reinicia o recarga la ventana si el panel no aparece.
Abre la carpeta raíz del repositorio, no un archivo aislado. Luego pulsa el icono de Claude en la barra de actividad o abre la paleta de comandos y busca las acciones de Claude Code. La primera sesión solicitará autenticación si aún no existe una cuenta activa.
# Diagnóstico independiente desde la terminal integrada
claude --version
git status
La extensión puede funcionar como panel gráfico o lanzar la experiencia de terminal. El panel es apropiado para comentarios y revisión visual; el modo terminal conserva exactamente la interfaz interactiva estudiada en los temas anteriores.
Si ya ejecutas claude dentro de la terminal integrada de VS Code, Claude Code puede detectar el editor e instalar o conectar automáticamente la integración, salvo que esa conducta haya sido desactivada por configuración.
Una referencia explícita es preferible a confiar sólo en el archivo activo. Usa el selector de contexto, menciona archivos con @ o incluye una selección. Un buen encargo une ubicación, objetivo y evidencia:
Revisa la función seleccionada en @src/services/orders.js. El diagnóstico marca que total puede ser undefined. Explica primero la causa, propone el cambio mínimo y no edites hasta que apruebe el plan. Después agrega un test de regresión y ejecuta sólo la suite de orders.
El editor aporta la selección y los diagnósticos, pero Claude aún necesita comprender dependencias y convenciones. Permite que explore los archivos relacionados; no adjuntes el repositorio completo manualmente.
git diff y git status antes del commit.La integración tiene configuraciones distintas que no deben mezclarse:
| Capa | Ejemplos | Alcance |
|---|---|---|
| Ajustes de la extensión | Usar panel o terminal, modo inicial de permisos, ubicación del panel. | Sólo la interfaz de VS Code. |
~/.claude/settings.json | Permisos, entorno, hooks, MCP, modelo y políticas personales. | CLI y superficies compatibles del usuario. |
.claude/settings.json | Reglas compartidas y extensiones aprobadas por el proyecto. | Equipo y repositorio. |
CLAUDE.md | Arquitectura, comandos, convenciones y criterios. | Contexto del proyecto, no preferencia visual. |
En los ajustes de VS Code, la extensión ofrece useTerminal y initialPermissionMode. Para autocompletar la configuración central agrega el esquema al archivo de Claude Code:
{
"$schema": "https://json.schemastore.org/claude-code-settings.json",
"permissions": {
"defaultMode": "default"
}
}
No uses bypassPermissions como comodidad predeterminada. Para explorar repositorios desconocidos, inicia en plan; para trabajo habitual, default conserva aprobaciones explícitas.
En IntelliJ IDEA, PyCharm, WebStorm, PhpStorm, GoLand o Android Studio abre Settings/Preferences → Plugins → Marketplace, busca Claude Code, instala el plugin oficial y reinicia completamente el IDE.
Hay dos formas de iniciar:
claude en la terminal integrada. Si la sesión vive en una terminal externa, ejecuta /ide para seleccionar y conectar el IDE detectado.cd ruta/al/proyecto
claude
/ide
Inicia la CLI desde la misma raíz que abrió JetBrains. De lo contrario, el IDE puede mostrar un proyecto mientras Claude trabaja sobre otro directorio, una discrepancia difícil de detectar al revisar rutas relativas.
El plugin aporta selección y pestaña activa, diagnósticos del IDE, referencias con líneas y el visor de diferencias de JetBrains. El atajo Ctrl+Alt+K en Windows/Linux o Cmd+Option+K en macOS inserta una referencia como @src/auth.ts#L20-48.
En Settings/Preferences → Tools → Claude Code puedes indicar el comando ejecutable. Ejemplos:
claude
/usr/local/bin/claude
npx @anthropic-ai/claude-code
# Ejemplo para WSL; sustituye Ubuntu por tu distribución
wsl -d Ubuntu -- bash -lic "claude"
Con /config configura el visor de diff en auto para usar el IDE o en terminal para mantenerlo dentro de la CLI. En Remote Development el plugin debe instalarse en el host remoto, donde realmente están los archivos y se ejecutan las herramientas.
Un diff integrado acelera la revisión, pero no demuestra que el cambio sea correcto. Revisa en tres niveles:
| Nivel | Pregunta | Evidencia |
|---|---|---|
| Local | ¿Cada línea hace lo que afirma el resumen? | Diff del editor, tipos y diagnósticos. |
| Comportamiento | ¿Cumple el contrato y preserva casos anteriores? | Tests focalizados, suite y prueba manual. |
| Alcance | ¿Sólo cambió lo autorizado? | git diff --stat, git diff y archivos sin seguimiento. |
No aceptes mecánicamente todos los fragmentos. Si uno es incorrecto, comenta la intención y pide un cambio mínimo. Tras ediciones manuales, informa a Claude para que vuelva a leer el archivo antes de continuar.
Usa uno de los proyectos de los temas 10 u 11 y crea un error pequeño en una rama de práctica. El ejercicio reproduce un flujo real:
Trabaja sólo en esta rama de práctica. Usa la selección y los diagnósticos visibles como punto de partida, pero confirma la causa leyendo sus llamadas y tests. No modifiques dependencias. Presenta un plan por archivos, agrega primero un test que falle por la razón esperada, implementa el cambio mínimo y reporta comandos y resultados. No hagas commit.
Al terminar compara el informe con la pestaña Source Control o Commit del IDE. El ejercicio está completo cuando puedes explicar cada línea modificada sin depender del resumen del agente.
El editor contiene archivos que pueden ejecutar acciones: tareas, configuraciones de depuración, plugins, scripts y ajustes del proyecto. Una edición aparentemente inocente puede ejecutarse al abrir, compilar o depurar.
Precaución en JetBrains: con edición automática, modificar configuración del IDE puede provocar ejecución indirecta y eludir la expectativa de un permiso Bash posterior. Usa aprobación manual en repositorios no confiables y revisa especialmente .idea/, tareas, configuraciones de ejecución y scripts de build.
deny para secretos y archivos que el agente no necesita leer.| Síntoma | Comprobaciones |
|---|---|
claude: command not found | Ejecuta claude --version fuera del IDE, reinicia el editor y configura la ruta completa del comando. |
| El IDE no se detecta | Confirma plugin habilitado, raíz coincidente, reinicio completo y conexión con /ide. |
| No aparece el diff gráfico | Comprueba conexión activa y configura el diff como auto; vuelve a abrir la sesión. |
| WSL usa otro entorno | Configura el comando WSL, abre el proyecto desde la misma distribución y evita mezclar rutas Windows/Linux. |
| Remote Development no funciona | Instala y habilita el plugin en el host remoto, no sólo en el cliente local. |
| Contexto equivocado | Verifica carpeta raíz, selección, archivo activo y referencias @; pide a Claude que enumere las rutas recibidas. |
| Ajustes no se aplican | Distingue ajustes de extensión, configuración Claude global, proyecto y políticas administradas. |
Para problemas de autenticación o instalación de la CLI vuelve a los temas 4 y 5: el plugin no corrige una sesión base mal configurada.
| Control | Esperado |
|---|---|
| Proyecto | IDE y Claude apuntan a la misma raíz y rama. |
| Integración | Extensión o plugin oficial, actualizado y conectado. |
| Contexto | Selección y referencias precisas; CLAUDE.md vigente. |
| Permisos | Modo acorde al riesgo; archivos sensibles denegados. |
| Verificación | Diagnósticos comprendidos, tests ejecutados y diff revisado. |
| Concurrencia | Una sesión por árbol de trabajo o aislamiento con worktrees. |
Consulta las guías oficiales de VS Code y JetBrains para cambios de atajos, opciones y compatibilidad.
Conclusión: integrar Claude Code con un IDE no reemplaza la terminal: combina contexto visual, diagnósticos y revisión de diffs con el mismo agente capaz de explorar y ejecutar herramientas. La mejor superficie es la que vuelve más fácil describir el objetivo y revisar la evidencia. En el próximo tema conectaremos este flujo con Git, GitHub y el trabajo en equipo.