En este post vamos a abordar las extensiones de VSCode para Javascript que debes conocer para configurar tu editor preferido en el trabajo con este lenguaje de programación. La verdad es que hay muchas herramientas estupendas para lo que es el lenguaje en sí, pero teniendo en cuenta los frameworks la lista podría ser inacabable.
Ten en cuenta que si deseas extensiones genéricas para trabajar con cualquier tipo de lenguaje, hace poco publicamos otro post de las extensiones más importantes de Visual Studio Code.
Extensiones de VSCode para el lenguaje Javascript
Te mostramos algunas extensiones básicas para el trabajo simplemente con el lenguaje.
npm Intellisense
Comenzamos por una extensión útil para npm, que te permitirá autocompletar el código cuando estás haciendo un import. Es muy útil para escribir menos y, sobre todo, para no equivocarnos al cargar las librerías de terceros.
npm
Esta extensión también te facilita el trabajo con npm pero se centra más en el archivo package.json, ayudando con la revisión de sintaxis y detectando posibles problemas de instalación de dependencias o con sus versiones. También nos ofrece utilidades para ejecutar los scripts npm.
JavaScript (ES6) code snippets
Con esta extensión tienes una excelente colección de snippets, que si te acostumbras a usarlos ahorrarás tiempo y no querrás estar sin ellos.
Import Cost
Esta extensión te permite saber qué ocupa cada una de las librerías que cargas mediante los imports, lo que es muy importante sobre todo para el desarrollo front-end y para ser conscientes del peso que agregamos al Javascript con cada import que realizamos.
Quokka.js
Esta extensión es bastante útil para obtener una ejecución rápida del Javascript a medida que estamos escribiendo el código. Permite ver con anotaciones en el propio editor el resultado de la ejecución de las sentencias o bucles. Es interesante para poder detectar posibles errores en tiempo de código a medida que vas escribiendo, ya sea de sintaxis pero sobre todo de tiempo de ejecución, lo que es todavía más útil.
Ten en cuenta que Quokka es una extensión comercial y tiene una versión de pago, aunque la parte gratuita sola ya supone una buena ayuda para los desarrolladores. Esta extensión la puedes complementar con Quokka Statusbar Buttons, para obtener unas herramientas de acceso rápido a Quokka desde la barra de estado.
Extensiones VSCode para el uso de librerías y frameworks Javascript
Ya si nos metemos con frameworks la lista podría ser interminable, pero vamos a ver las extensiones principales de las tecnologías más usadas en Javascript, como son Angular y React.
Angular TypeScript Snippets for VS Code
Esta es la extensión de snippets de John Papa, uno de los principales gurús de Angular,
Angular Language Service
En esta extensión nos ofrecen una serie de ayudas a la hora de escribir los templates de Angular, permitiendo acceder a las propiedades de los componentes de una manera rápida y sin errores, entre otras cosas.
ES7 React/Redux/GraphQL/React-Native snippets
Esta es una de las extensiones más populares para React, que aglutina diversas ayudas en el código de componentes React y de muchas tecnologías de su ecosistema, como React Native o Redux.
Simple React Snippets
Si buscas snippets para React no te puede faltar esta extensión.
Extensiones de VSCode para Typescript
Acabamos recomendando algunas extensiones de Visual Studio Code para TypeScript, un superset de Javascript que ha ido ganando mucha popularidad.
JavaScript and TypeScript Nightly
Permite mayores utilidades del intellisense del código TypeScript, extendiendo el editor para el soporte de las mejoras más recientes del lenguaje.
Move TS – Move TypeScript files and update relative imports
Otra extensión básica que permite que los imports de TypeScript se actualicen correctamente cuando movemos los archivos a otras carpetas del proyecto.