Doug Stevenson
Doug Stevenson
 Representante de programadores

Al remontarme a lo que sucedió unos 10 años atrás, cuando redactaba código para una base de código monolítica escrita en C++, uno de los peores recuerdos que tengo de esa época es el de haber tenido que esperar que se completara una compilación solo para ejecutar algunas líneas de código nuevo. El padecimiento era tan común entre los ingenieros, que de él surgió una de las historietas más populares de todos los tiempos, XKCD:

Es una idea excelente, si se aplica de forma segura.

Por entonces, en mi oficina no había espadas para jugar, por lo que esperar a que finalizara una compilación era muy aburrido.

El padecimiento sería similar si tuviera que implementar mi código de Cloud Functions cada vez que desee probar una función. Por suerte, Firebase CLI ahora tiene un emulador local que funciona con HTTPS y otros tipos de funciones. Esto me permite ejecutar las funciones en mi máquina de desarrollo emulando los eventos activadores. Puedes hallar más información en la documentación.

Una de las funciones prácticas del emulador es que vuelve a cargar los archivos JavaScript que cambian con el tiempo. Por lo tanto, si modificas el código de una función, puedes probarla de inmediato en el emulador sin tener que reiniciarla:
  1. Cambiar al editor de código y escribir JavaScript.
  2. Pasar al emulador y ejecutar el código.
  3. GOTO 1

Es rápido y fácil, y te mantiene “dentro de la zona”.

Sin embargo, el proceso se vuelve un poco menos sencillo al realizar el cambio de JavaScript a TypeScript. La ejecución de TypeScript en Cloud Functions requiere una fase de compilación para convertir TypeScript a JavaScript de modo que el emulador pueda ejecutarlo. Se suman algunas complejidades:
  1. Pasar al editor de código y escribir TypeScript.
  2. Pasar al símbolo del sistema y ejecutar npm run build para generar JavaScript.
  3. Pasar al emulador y ejecutar el código.
  4. GOTO 1

Hay una manera más sencilla de hacer esto sin la necesidad de ejecutar un comando en cada ocasión. El compilador de TypeScript (tsc) tiene un “modo de supervisión” especial que le permite registrar los cambios realizados en tu TypeScript y compilarlos automáticamente. Puedes ejecutarlo desde la línea de comando cambiando a tu carpeta de funciones y ejecutando este comando: 
./node_modules/.bin/tsc --watch

Con esta ejecución y el emulador local, que registra automáticamente los cambios realizados en el código JavaScript compilado, tu flujo de desarrollo vuelve a esto:
  1. Pasar al editor de código y escribir TypeScript.
  2. Pasar al emulador y ejecutar el código.
  3. GOTO 1

A su vez, si usas VSCode, incluso puedes hacer que ejecute tsc directamente en el modo de supervisión. Puedes activarlo desde Tasks -> Run Build Task..., luego selecciona “tsc: watch”.

Esto activará un shell de comando directamente en el IDE, ejecutará tsc --watch y hará que se muestre el resultado. Verás mensajes como este, junto con los errores de compilación, cada vez que se modifique un archivo TypeScript: 
2:38:38 PM - File change detected. Starting incremental compilation...
2:38:38 PM - Compilation complete. Watching for file changes.

Ten en cuenta que tsc en el modo de supervisión no ejecutará TSLint con tu código, por lo que debes asegurarte de configurar eso en VSCode de modo que siempre puedas ver sus recomendaciones, tal como lo mostré en una entrada del blog anterior. Si no aplicas lint a tu código, te recomendamos mucho que lo hagas porque detectarás posibles errores que podrían ser muy perjudiciales para la producción.