↓Ir al contenido
Alemasone

Las mejores extensiones de VS Code que debes instalar

Pocas y buenas: te recomiendo las mejores extensiones para programar, desde formateadores hasta herramientas Git, evitando las que ralentizan tu editor.

8 min de lectura Actualizado el
Editor Visual Studio Code abierto con el panel de extensiones en primer plano
En esta página
Tener treinta extensiones instaladas es un problema, no una configuración. Cada una retrasa el arranque, consume memoria y puede entrar en conflicto con las demás. Las que realmente necesitas se cuentan con los dedos de las dos manos, y muchas cosas para las que hace años instalabas una extensión, hoy Visual Studio Code ya las hace solo.

Antes de añadir nada, mira qué hace ya el editor: formateo al guardar, renombrado de símbolos en todo el proyecto, Git, terminal, buscar y reemplazar con expresiones regulares, múltiples cursores a la vez, vista previa de Markdown, sincronización de ajustes, depuración de JavaScript en el navegador y paréntesis coloreados por parejas. Para estas últimas tres, hasta hace unos años, necesitabas Settings Sync, Debugger for Chrome y Bracket Pair Colorizer: si todavía las tienes, puedes quitarlas.

Las extensiones se instalan desde el panel Extensiones (Ctrl + Mayús + X): buscas el nombre, pulsas Instalar y, por lo general, funcionan de inmediato. Casi todas son gratuitas. Aquí tienes lo esencial, dividido por función.

Calidad del código #

Prettier formatea el código siguiendo reglas comunes: se acabaron las discusiones sobre comillas, puntos y coma o sangrías. Lo configuras una vez por proyecto con un archivo .prettierrc y activas Format On Save en los ajustes.

ESLint es el controlador: te señala errores reales y prácticas arriesgadas mientras escribes, no cuando el programa se rompe. También debe instalarse como paquete en el proyecto; la extensión por sí sola no basta.

EditorConfig hace que todos los editores respeten las mismas reglas básicas (tipo de sangría, fin de línea, codificación) y es indispensable cuando alguien del grupo usa otro programa.

Con estas tres desaparece gran parte de las diferencias de estilo que ensucian las revisiones de código.

Inteligencia artificial #

GitHub Copilot ya está integrado en VS Code: completa líneas mientras escribes, responde en el chat lateral y, en modo agente, puede modificar varios archivos por ti. Desde 2024 existe un plan gratuito con un número limitado de completados y mensajes al mes, y en 2025 Microsoft ha hecho que la parte del chat dentro del editor sea de código abierto.

Si prefieres otro modelo, tienes las extensiones de Gemini Code Assist, Claude Code, Codex y alternativas abiertas como Continue, que también se conectan a modelos instalados en tu propio ordenador. Tabnine, que mencionaba la lista anterior, sigue existiendo pero ha perdido terreno.

Dos precauciones. El código que envíes al asistente acaba en los servidores del proveedor; por tanto, si trabajas en proyectos profesionales, comprueba qué permite tu empresa. Y vuelve a leer lo que escribe: se equivoca con mucha seguridad.

Git y colaboración #

GitLens te muestra quién ha escrito cada línea y cuándo, directamente junto al código, y hace que el historial sea legible sin salir del editor. Cuando trabajas con código escrito por otros, es una de las más útiles de todas. Algunas funciones, como el Commit Graph en repositorios privados, están en la versión Pro.

Git Graph es la alternativa gratuita si solo necesitas el gráfico de ramas y commits, la misma función que hacía el antiguo Git History.

Live Share permite que dos personas editen el mismo archivo, cada uno desde su ordenador, compartiendo también la terminal y el servidor local. Para ayudar a alguien a distancia, funciona mejor que cualquier uso de pantalla compartida.

Commit Graph de GitLens en Visual Studio Code con el historial de commits y ramas
El Commit Graph de GitLens muestra las ramas y los commits del proyecto de un vistazo

Desarrollo web #

Live Server inicia un pequeño servidor local que recarga el navegador cada vez que guardas. Para un sitio estático o un ejercicio de HTML y CSS, es la vía más rápida.

Auto Rename Tag renombra la etiqueta de cierre cuando cambias la de apertura: algo pequeño, pero te ahorra muchísimas correcciones.

Las extensiones de tu framework (React, Vue, Svelte, Astro) aportan autocompletado y diagnóstico específicos. Instala solo la del framework que uses: las demás solo pesan. Para React, ES7+ React/Redux/React-Native Snippets crea un componente con apenas unas letras, por ejemplo rafce.

CSS Peek abre la regla CSS de una clase directamente desde el HTML, y el editor ya te muestra el color de los códigos hexadecimales junto al valor.

Thunder Client o una extensión similar te permite probar llamadas a APIs desde el editor, sin tener que abrir un programa aparte.

Lenguajes y entornos #

Aquí la regla es instalar solo lo que uses:

ÁmbitoExtensión de referencia
PythonLa extensión oficial Python con Pylance
C y C++La extensión C/C++ de Microsoft o clangd
Docker y contenedoresContainer Tools (la extensión que antes se llamaba Docker)
Trabajo en servidores remotosRemote - SSH, para trabajar como si los archivos fueran locales
Bases de datosUna extensión cliente para la base de datos que uses
MarkdownMarkdown All in One, para atajos, índice y vista previa
Archivos CSVRainbow CSV, que colorea las columnas

Remote - SSH merece un par de líneas más: abre una carpeta en una máquina remota y te permite usar todas las funciones del editor, incluida la terminal, como si el código estuviera en tu ordenador. Si desarrollas en servidores, esto te cambia la vida. Con WSL haces lo mismo con Linux dentro de Windows.

Visual Studio Code con el panel de la extensión Remote - SSH y la conexión a un servidor remoto
Con Remote - SSH, el editor trabaja sobre los archivos del servidor como si fueran locales

Para probar rápidamente un script en cualquier lenguaje tienes Code Runner, que lo lanza con un clic. Es cómodo para ejercicios; para un proyecto real usa la terminal o el depurador.

Comodidades del día a día #

Code Spell Checker detecta erratas en comentarios, cadenas de texto y nombres de variables. Con el diccionario español también puedes usarlo para textos.

Error Lens muestra el mensaje de error junto a la línea en lugar de en el panel inferior: lo lees justo donde ya estás mirando.

Path Intellisense completa las rutas de los archivos mientras las escribes y reduce errores en las referencias relativas.

Todo Tree recopila en un panel todos los TODO comentarios FIXME del proyecto, Bookmarks te permite poner marcadores en las líneas que visitas a menudo, y Peacock colorea la ventana de forma distinta para cada proyecto, algo muy útil cuando tienes tres abiertos a la vez.

Los temas e iconos (como vscode-icons o Material Icon Theme) son una cuestión de gustos y no cambian el funcionamiento: elige uno y deja de buscar.

Usa los perfiles. Con los perfiles de VS Code puedes tener diferentes grupos de extensiones para distintos contextos; por ejemplo, uno para web, otro para Python y uno mínimo para escribir, y pasas de uno a otro sin tener que desinstalar nada. Así el editor se mantiene ligero sin renunciar a nada.

Las extensiones que ralentizan el editor #

Si VS Code tarda varios segundos en abrirse, por lo general la culpa es de una extensión.

El comando Developer: Show Running Extensions, desde la paleta de comandos (Ctrl + Mayús + P), enumera las extensiones activas con el tiempo de activación de cada una: encontrarás la responsable en pocos segundos.

Help: Start Extension Bisect lo hace aún más rápido: desactiva la mitad de las extensiones a la vez hasta que encuentre la que causa el problema.

Lista de Running Extensions de VS Code con el tiempo de activación de cada extensión
La lista ordena las extensiones por tiempo de activación: la culpable estará arriba del todo

Cuidado con las copias. En el Marketplace hay extensiones con nombres casi idénticos a las famosas, a veces con código malicioso que lee tus archivos o roba credenciales; esto ha pasado varias veces incluso en 2025. Antes de instalar, comprueba que el editor tenga la marca de verificación, mira el número de instalaciones y abre el enlace al repositorio del proyecto.

Cuántas son necesarias #

Para quienes desarrolláis para la web, una configuración sensata consta de ocho extensiones: Prettier, ESLint, EditorConfig, GitLens, Live Server, la del framework que uses, Error Lens y Code Spell Checker. Añade Remote - SSH si trabajas en servidores, un asistente de inteligencia artificial si lo necesitas y la extensión del lenguaje que utilices fuera de la web.

El resto ya lo valorarás cuando tengas un problema concreto, no antes. La extensión que instalas «por si acaso» es la que dentro de seis meses ralentiza el inicio sin que nadie sepa por qué está ahí.

Preguntas frecuentes #

¿Las extensiones ralentizan Visual Studio Code? #

Sí, y se puede medir: cada una añade tiempo de arranque y memoria. La diferencia entre diez extensiones y cuarenta se nota sobre todo cuando abres proyectos grandes. Con las herramientas de diagnóstico integradas puedes ver cuánto consume cada una.

¿Las extensiones son gratuitas? #

Casi todas sí, y muchas son open source. Algunas tienen funciones de pago (GitLens Pro, Thunder Client para equipos) y los asistentes de inteligencia artificial tienen planes gratuitos con límites y suscripciones para un uso intensivo.

¿Puedo sincronizar las extensiones entre varios ordenadores? #

Sí, la sincronización está integrada: se activa desde el icono de la cuenta en la parte inferior izquierda y alinea extensiones, ajustes, atajos de teclado y temas en todos los dispositivos conectados a la misma cuenta de GitHub o Microsoft.

¿Prettier y ESLint hacen lo mismo? #

No, y se usan juntas. Prettier se encarga del formato (espacios, saltos de línea, comillas) y es puramente estético. ESLint comprueba el fondo: variables no utilizadas, comparaciones riesgosas o errores lógicos recurrentes. Con la configuración eslint-config-prettier ambos no entran en conflicto.

¿Hace falta una extensión para trabajar con Git? #

No, las operaciones cotidianas ya las hace el editor. GitLens añade contexto (quién escribió qué, cuándo y por qué), lo cual resulta valioso en proyectos con mucho historial o mucha gente trabajando a la vez.

¿Cómo sé si una extensión es segura? #

Comprueba que el editor esté verificado, mira las instalaciones y valoraciones, y abre el repositorio para ver si el proyecto está activo. Desconfía de las extensiones con nombres casi iguales a las famosas y de aquellas publicadas hace poco sin trayectoria.

Sigue leyendo