Desde el lanzamiento de Visual Studio Code en 2015, la popularidad del editor de código fuente no ha hecho más que crecer y ganar el espacio que se dividió entre editores como Sublime Text, Atom, Vim y muchos otros.
Hace un 1 o 2 años, como otros desarrolladores que trabajan conmigo, decidí probar el cambio de Atom, Notepad++ o Sublime Text, como el editor habitual, a Visual Studio Code. Y desde entonces cada día me gusta más.
Hoy hablaré de los 10 mejores plugins o extensiones que siempre añado en el editor cuando configuro un nuevo entorno de trabajo.
1 – Settings Sync
En realidad esta es la primera extensión que añado cuando instalo el Visual Code en alguna máquina nueva y es ciertamente una de mis favoritos.
Basicamente tengo varios entornos de trabajo, y a veces trabajo desde casa y otras veces trabajo en el portatil, pero no me gusta nada tener cada entorno con unas herramientas diferentes. es por eso que uso este plugin para sincronizar todas las tools.
El uso de GitHub Gist Settings Sync sincroniza todos tus ajustes, temas y extensiones para que no tengas que volver a trabajar cuando configures un nuevo entorno de escritorio o si quieres mantener todas las instancias del editor, instaladas en diferentes máquinas, practicamente iguales.
2 – Importador de teclas de Atom o Sublime
Para los acostumbrados a los atajos de Texto de Atom o Sublime, esta extensión ayuda mucho en el proceso de migración, ya que permite configurar los atajos de Visual Studio Code para realizar las mismas funciones que los atajos de Texto Sublime.
3 – Document This
Cuando trabajas en proyectos con múltiples desarrolladores, es extremadamente importante que tu código esté bien escrito, sea legible y esté documentado. Otras personas pueden mantener el mismo código y, con él bien documentado, hará este proceso mucho más fácil.
Document This ayuda mucho a estandarizar la documentación del código Javascript, trayendo una simple plantilla de comentarios por encima de sus funciones, métodos y clases y colaborando a la intelliSence del Visual Studio Code.
4 – EditorConfig para el Visual Studio Code
Es común que cada desarrollador tenga sus preferencias de configuración de editor para codificar de una manera que le convenga.
Sin embargo, en el caso de los proyectos compartidos, es importante mantener algunos ajustes del editor (como el charset, el estilo de indentación, el tamaño de la indentación, entre otros) en común para todos los devs que colaboran con el proyecto. Además de la importancia del patrón de desarrollo de proyectos, si tú o tu empresa utilizan git para versionarlo, fácilmente alertará de conflictos simplemente porque una línea está con la sangría de espacio y otro dev ha “cambiado” el archivo con la sangría en tabulación, por ejemplo.
EditorConfig nos ayuda con esto. Sólo tienes que instalar el plugin y crear un archivo llamado .editorconfig con la configuración que quieras que sea estandarizada para todos los devs, y esa configuración se aplicará a todos los editores, que tengan el plugin instalado, sólo para ese proyecto en particular.
5 – Project Manager
El director del proyecto le ayuda a organizar sus proyectos locales.
Puede establecer Proyectos Favoritos o elegir Proyectos de Visual Studio Code, Repositorios Git, etc etc.
6 – ESLint
ESLint es un conocido de Javascript. Sirve para crear reglas y patrones para tu código Js (punto y coma, sangría, etc.), advirtiéndote de errores o advertencias si tu código está fuera de las reglas definidas.
En caso de que no lo sepas, vale la pena leer la documentación porque ayuda mucho en la calidad de tu código.
7 – Intellisense npm
Cada vez es más común que los proyectos usen las dependencias instaladas del NPM. Y esta extensión facilita la importación de estos módulos en su código.
8 – Prettier – Code formatter
Me gusta que esté todo el código bien formateado , mejora la legibilidad del código, pero por otro lado me cuesta y me aburre un poco tener que estar dando espacios o tabuladores cuando importo el código de otro sitio o quiero realizar algunas pruebas rápidas, es por eso que uso este plugin y cada vez que se guardan los cambios se autoformatea el código sin que tengas que realizar nada.
Si todo el equipo de trabajo utiliza las mismas opciones tendréis el código con las mismas características.
9 – Live Server
El Live Server le ofrece de forma muy sencilla un servidor local con derechos de recarga en directo para que pueda desarrollar sus proyectos.
Es una gran ayuda especialmente para los proyectos pequeños.
10 – Git Lens
El Visual Studio Code ya tiene integración nativa con Git, pero el plugin Git Lens es una extensión muy poderosa que extiende las características del versionador que no están disponibles de forma nativa.
Te ayuda a ver rápidamente la autoría de códigos a través de las anotaciones, a navegar y explorar los repositorios de Git, a obtener información valiosa a través de potentes comandos de comparación y mucho más.