Hace poco hablábamos que para pasar JSLint ( o JSHint ) en nuestro código JavaScript desde Visual Studio 2012 teníamos que echar mano de Chirpy. El otro día investigando esto con Rodrigo, vimos que en este breve ( o no tan breve ) lapso de tiempo tenemos dos herramientas más que nos ayudarán en esta tarea, Web Essentials 2012 y JSLint for Visual Studio 2012. Aquí van las conclusiones que saqué:
Web Essentials 2012
Web Essentials es una extensión de Visual Studio muy conocida. A parte de ayudarnos con JSHint, maneja archivos LESS, TypeScript, CoffeScript, y un largo etcétera. Instalarlo es muy sencillo, solo tenéis que ir a la opción del menú «Extensions and Updates» e instalaros la extensión:
Una vez instalada la extensión ( y reiniciado VS2012 ) veremos que si hacemos un fichero con un código tan simple como este:
if ( a == 1 )
veremos en la ventana de warnings los siguientes errores:
¡La que podemos liar con tan sólo una línea!
Para configurar las opciones del analizador estático de código tenemos que irnos a TOOLS -> Options
A parte de las configuraciones sobre qué errores mostrar o no mostrar (que os animo a qué exploréis) algo que me parece importante es decidir donde se van a mostrar los mensajes de error. Por defecto estos se muestran en la pestaña de Warnings, pero a mi me gusta tratar estos errores como tales y, por lo tanto, prefiero que Visual Studio me los marque como errores. Por tanto, cambiamos el «Error location» a Error. El problema con esta extensión es que nos pone los mensajes en la pestaña de errores pero no nos da la build por fallida, con lo que, si no somos muy cuidadosos, podemos obviar estos mensajes y nada malo nos pasará. Otro «problema» es que solo se pasa cuando un fichero .js se guarda.
JSLint for Visual Studio 2012
JSLint for Visual Studio 2012 es una extensión cuya única finalidad es pasarnos el analizador estático de código. La manera de instalarla es idéntica a Web Essentials:
Las opciones de JSLint están directamente debajo del menú TOOLS y en la siguiente imagen podemos ver que son muy completas:
Algo importante que podemos ver es que podemos validar los archivos tanto al grabar como al realizar una build, que podemos tratar estos mensajes como errores y que podemos cancelar la build si hay errores. Si lo configuramos así podemos ver en nuesta ventana de errores lo siguiente:
Como podéis ver, en la última línea nos informa que ha cancelado la compilación por errores de validación de JSLint.
Otra cosa interesante que tiene JSLint for Visual Studio 2012 y que no tiene Web Essentials es que podemos marcar tanto ficheros individuales como carpetas enteras para que no se le pase el analizador de código. Esto es recomendable cuando trabajamos con librerías de terceros y no queremos que influyan en nuestra build.
Y por último, algo también muy interesante es que, haciendo click con el botón derecho sobre la solución en el Explorador de Soluciones, podemos añadir el archivo de configuración de JSLint.
Esto nos permitirá subir este archivo a nuestro repositorio de fuentes y que todos los miembros del equipo compartan la misma configuración de la extensión para esta solución ya que la extensión por defecto carga la configuración de este archivo.
Espero que os haya parecido de utilidad!