Extensión de VS Code que explica errores comunes de JavaScript, TypeScript y
Python en español claro, directo desde el editor — sin salir a buscar en
Google ni traducir mensajes técnicos en inglés.
Cómo probarla en tu computadora (modo desarrollo)
Necesitas tener instalado Node.js (v18 o superior) y VS Code.
Abre esta carpeta en VS Code.
Abre una terminal dentro de VS Code y corre:
npm install
npm run compile
Presiona F5 (o ve a "Run and Debug" → "Run Extension"). Esto abre
una segunda ventana de VS Code llamada "Extension Development Host",
con tu extensión ya cargada.
En esa ventana nueva, abre o crea un archivo .js, .ts o .py con
algún error a propósito, por ejemplo:
console.log(variableQueNoExiste);
Pasa el mouse sobre la línea subrayada en rojo — deberías ver, además
del mensaje normal de VS Code, un bloque con el título
"🇪🇸 Variable no definida" y la explicación en español.
También puedes poner el cursor en la línea con el error y ejecutar el
comando "Explica tus Errores: Explicar error en esta línea" desde
la paleta de comandos (Ctrl+Shift+P / Cmd+Shift+P).
Estructura del proyecto
src/extension.ts — punto de entrada: registra el hover provider y el
comando.
src/errorDictionary.ts — el diccionario de errores. Cada entrada tiene
un patrón (regex) que compara contra el mensaje real del error, más un
título, explicación y solución en español. Aquí es donde vas a pasar
más tiempo agregando cobertura — mientras más errores comunes cubras,
más útil se vuelve la extensión.
Cómo agregar un error nuevo al diccionario
Copia y pega un bloque como este dentro del arreglo diccionarioErrores
en src/errorDictionary.ts:
{
pattern: /texto o parte del mensaje de error en inglés/i,
titulo: "Nombre corto y claro del error",
explicacion: "Qué significa este error en términos sencillos.",
solucion: "Qué hacer para arreglarlo, paso a paso si se puede.",
},
Siguientes pasos sugeridos (en orden)
Validar antes de invertirle más tiempo: comparte un GIF corto
mostrando el hover en acción en un grupo de Discord/Facebook de
programadores hispanohablantes, y pregunta si la instalarían. Esto no
cuesta nada y te dice si vale la pena seguir.
Si hay interés: amplía el diccionario con más errores reales
(revisa foros como StackOverflow en español, o pide a tus compañeros
de clase que te compartan capturas de sus errores más comunes).
Publícala gratis en el VS Code Marketplace para empezar a construir
usuarios y reputación (necesitas crear una cuenta de "publisher" en
https://marketplace.visualstudio.com/manage — es gratis).
Una vez que tengas usuarios reales, ahí es cuando conviene pensar en
una versión premium (por ejemplo: explicar CUALQUIER error usando IA,
no solo los del diccionario, cobrando una licencia mensual a través de
un proveedor externo como Fungies.io o Dodo Payments, ya que el
Marketplace de VS Code no tiene cobro integrado).
Publicar en el Marketplace (cuando estés listo)
npm install -g @vscode/vsce
vsce package
Esto genera un archivo .vsix que puedes instalar manualmente
(code --install-extension nombre.vsix) para probarlo tal cual lo
instalaría un usuario final, o subirlo al Marketplace con vsce publish.
