TutorialesTutorials · PrincipianteBeginner

Cómo conectar Claude a Visual Studio CodeHow to connect Claude to Visual Studio Code

Guía paso a paso para principiantes: instala Node.js, VS Code y Claude Code, inicia sesión y haz tu primera prueba. Incluye el atajo más rápido y los precios actuales.Beginner step-by-step guide: install Node.js, VS Code and Claude Code, sign in and run your first test. Includes the fastest shortcut and current pricing.

  • Claude Code
  • VS Code
  • Node.js

En esta guía vas a aprender a usar Claude Code dentro de Visual Studio Code (VS Code): un asistente que vive en tu editor y te ayuda a escribir y entender código, crear archivos y construir proyectos.

Elige tu sistema (Windows o Mac) con los botones de arriba y toca cada paso para abrirlo y seguirlo.

In this guide you’ll learn to use Claude Code inside Visual Studio Code (VS Code): an assistant that lives in your editor and helps you write and understand code, create files and build projects.

Pick your system (Windows or Mac) with the buttons above and tap each step to open and follow it.

Antes de empezar: Claude Code necesita una cuenta de pago de Claude (Pro o Max), no hay versión 100 % gratis. Mira los precios en la columna de la derecha.Before you start: Claude Code needs a paid Claude account (Pro or Max), there’s no 100% free version. See pricing in the right column.

1 Instalar Node.jsInstall Node.js

Node.js es el motor que Claude Code necesita para funcionar.

  1. Entra a https://nodejs.org
  2. Descarga la versión que dice “LTS” (la más estable).
  1. Abre el archivo .msi y dale “Siguiente” hasta “Finalizar”.
  1. Abre el archivo .pkg y sigue los pasos.

Para comprobar que funcionó: abre PowerShellla Terminal, escribe esto y aprieta Enter:

node --version

Si aparece un número con puntos como v22.11.0, ¡listo!

Node.js is the engine Claude Code needs to run.

  1. Go to https://nodejs.org
  2. Download the version marked “LTS” (the most stable).
  1. Open the .msi file and click “Next” until “Finish”.
  1. Open the .pkg file and follow the steps.

To check it worked: open PowerShellthe Terminal, type this and press Enter:

node --version

If a dotted number like v22.11.0 appears, you’re set!

2 Instalar Visual Studio CodeInstall Visual Studio Code
  1. Entra a https://code.visualstudio.com
  2. Aprieta el botón azul de descarga (detecta tu sistema solo).
  1. Abre el instalador, acepta los términos y dale “Siguiente”.
  1. Descomprime el archivo y arrastra VS Code a tu carpeta de Aplicaciones.
  1. Abre VS Code para confirmar que funciona.
  1. Go to https://code.visualstudio.com
  2. Click the blue download button (it detects your system).
  1. Open the installer, accept the terms and click “Next”.
  1. Unzip the file and drag VS Code into your Applications folder.
  1. Open VS Code to confirm it works.
3 Instalar la extensión de Claude CodeInstall the Claude Code extension
  1. Abre VS Code.
  2. Abre el panel de extensiones (4 cuadritos en la barra izquierda) o usa Ctrl + Shift + XCmd + Shift + X.
  3. Busca Claude Code y elige la del creador Anthropic (la oficial). Aprieta Install.
  4. La primera vez puede pedirte instalar el motor de Claude Code. Acepta. (Si te lo pide en la terminal, ejecuta npm install -g @anthropic-ai/claude-code.)
  5. Al terminar, verás el ícono de Claude (✳) en la barra lateral.

¿No aparece el ícono? Cierra y vuelve a abrir VS Code.

  1. Open VS Code.
  2. Open the Extensions panel (4 squares in the left bar) or use Ctrl + Shift + XCmd + Shift + X.
  3. Search for Claude Code and pick the one by Anthropic (the official one). Click Install.
  4. The first time it may ask to install the Claude Code engine. Accept. (If it asks in the terminal, run npm install -g @anthropic-ai/claude-code.)
  5. When it’s done, you’ll see the Claude (✳) icon in the side bar.

Icon not showing? Close and reopen VS Code.

4 Iniciar sesiónSign in
  1. Abre Claude Code con su ícono (✳) (o en la terminal de VS Code escribe claude).
  2. Te pedirá iniciar sesión; se abrirá tu navegador.
  3. Inicia sesión con tu cuenta de Claude (la del plan de pago).
  4. ¡Listo! Ya puedes pedirle ayuda a Claude.

No necesitas una “API key”. Solo inicia sesión con tu cuenta.

  1. Open Claude Code with its (✳) icon (or type claude in VS Code’s terminal).
  2. It will ask you to sign in; your browser opens.
  3. Sign in with your Claude account (the one with the paid plan).
  4. Done! You can now ask Claude for help.

You don’t need an “API key”. Just sign in with your account.

Atajo: instálalo en 3 comandosShortcut: install in 3 commands

Si te animas con la terminal, esta es la forma más rápida (también instala la integración de VS Code por ti):

  1. Instala Node.js (Paso 1).
  2. En la terminal de VS Code (Terminal → Nueva terminal) ejecuta:
npm install -g @anthropic-ai/claude-code
  1. En la carpeta de tu proyecto, ejecuta:
claude

La primera vez te ofrecerá instalar la extensión de VS Code (acepta) y te pedirá iniciar sesión.

If you’re comfortable with the terminal, this is the fastest way (it also installs the VS Code integration for you):

  1. Install Node.js (Step 1).
  2. In VS Code’s terminal (Terminal → New Terminal) run:
npm install -g @anthropic-ai/claude-code
  1. In your project folder, run:
claude

The first time it will offer to install the VS Code extension (accept) and ask you to sign in.

Probar que todo funcioneTest that it works
  1. En VS Code abre una carpeta con Archivo → Abrir carpeta.
  2. Abre Claude Code con su ícono (✳).
  3. Escríbele: “Crea un archivo que diga Hola Mundo en Python”.
  4. Claude te muestra lo que va a hacer y tú aceptas o rechazas con un clic.
  1. In VS Code open a folder with File → Open Folder.
  2. Open Claude Code with its (✳) icon.
  3. Ask it: “Create a file that says Hello World in Python”.
  4. Claude shows you what it’ll do and you accept or reject with a click.
Si algo sale malIf something goes wrong
ProblemaSolución
No aparece el ícono de Claude ✳Cierra y vuelve a abrir VS Code
Dice que no encuentra “node”Vuelve al Paso 1 e instala Node.js
No me deja usar ClaudeRevisa que tu cuenta tenga plan de pago (Pro o Max)
Instalé la extensión equivocadaAsegúrate de que el creador sea Anthropic
ProblemFix
The Claude icon ✳ doesn’t appearClose and reopen VS Code
It says it can’t find “node”Go back to Step 1 and install Node.js
It won’t let me use ClaudeCheck your account has a paid plan (Pro or Max)
I installed the wrong extensionMake sure the publisher is Anthropic

Preguntas frecuentesFrequently asked questions

¿Claude Code es gratis?Is Claude Code free?

La extensión es gratis de instalar, pero para usarla necesitas un plan de pago de Claude (Pro desde $20/mes). No hay versión 100% gratis.

The extension is free to install, but to use it you need a paid Claude plan (Pro from $20/mo). There's no 100% free version.

¿Necesito saber programar para usar Claude Code?Do I need to know how to code to use Claude Code?

No. Le describes lo que quieres en palabras y Claude escribe el código por ti; tú revisas y apruebas. Es ideal para principiantes.

No. You describe what you want in words and Claude writes the code for you; you review and approve. It's ideal for beginners.

¿Funciona en Windows y en Mac?Does it work on Windows and Mac?

Sí, funciona igual en ambos. Esta guía marca los pasos que cambian entre Windows y Mac con el selector de arriba.

Yes, it works the same on both. This guide marks the steps that differ between Windows and Mac with the switch at the top.

¿Necesito una API key?Do I need an API key?

No. Solo inicias sesión con tu cuenta de Claude; no hace falta configurar ninguna API key.

No. You just sign in with your Claude account; no API key setup needed.