Typescript y Node ESM
Ricardo Vega / 10 febrero 2022
⏰ 4 minutos
Ricardo Vega / 10 febrero 2022
⏰ 4 minutos
Typescript es un lenguaje de programación que compila a Javascript y que basándose en las características y sintaxis de Javascript, le añade tipado, lo que nos ayuda a escalar la construcción de aplicaciones (Node o Navegador).
Tal vez en el futuro, escriba un post específico sobre Typescript y dónde creo que puede ser de gran ayuda, pero no es el objetivo de este post, donde me quiero centrar en un problema que está empezando a surgir (realmente llevamos casi un año con él), dentro del ecosistema Javascript.
Por norma general, un usuario podía emplear una libraría o módulo en su aplicación independientemente de si era Javascript o Typescript tanto la aplicación que estuviésemos contruyendo como la librería en sí. De este modo, si estamos construyendo una aplicación Typescript, podemos usar sin ninguna complicación módulos en Javascript y en Typescript. Si por el contrario, estamos construyendo una aplicación en Javascript podremos usar librerías escritas en Javascript (evidentemente) o en Typescript si está compilada a Javascript.
Para ello, usámos el sistema de importación / exportación de Node, llamado CommonJS. Sin embargo, las nuevas versiones de Node cambian el sistema de importanción, pudiendo romper esta compatibilidad Javascript - Typescript. Veamos el asunto en detalle.
TLDR. A partir de la version 12 de Node, existe un nuevo sistema de importación/exportación de módulos llamado ESM que es incompatible con Typescript.
Sin entrar en demasiado detalle, el anterior sistema de importación (CommonJS)
era el que usábamos cuando hacíamos require("my-module") mientras que ESM es
el de import / export.
Tal vez, algunos de vosotros que ya llevéis tiempo realizando aplicaciones, os
estéis preguntando si esto os afecta ya que llevas usando import / export
mucho tiempo sin preocuparte del sistema de carga de módulos que estabas usando.
No quiero hacer una afirmación categórica porque evidentemente cada uno de
vosotros podéis estar en una situación particular distinta, pero es muy factible
que esa carga la estuviese realizando, dentro de vuestra aplicación babel /
webpack u otras herramientas del estilo que usaseis de forma directa o
indirecta.
En las nuevas versiones de Node, esta carga es nativa.
Todo esto gana relevancia ahora porque desde Abril de 2021, Node 12 es la versión LTS más vieja que aún cuenta con mantenimiento y por tanto no deberíamos usar versiones más antiguas a la 12.
Esto está haciendo que muchos desarrolladores y creadores de librerías estén moviendo sus módulos a ESM que (y aquí viene el primer truco) cambia la forma de construir el módulo. Se pueden hacer módulos compatibles con los dos sistemas pero requiere un esfuerzo adicional sobre todo de mantenimiento que varios desarrolladores importantes no quieren seguir simplemente para "dar soporte a un sistema de módulos obsoleto".
Por resumir hasta aquí y si nuestra aplicación usa Node >=12:
import/export y webpack hará la conversión. También puedo usar la
sinxtaxis de require().import/export
(nativo de Node) y la sintaxis require() no me va a funcionar.Esto, ya de por si podría causar inconvenientes pero es asumible (uso siempre import/export y me desentiendo de si el trabajo lo hace Node de forma nativa o delega en webpack) Sin embargo, y aquí viene el punto central que motiva este post, ESM hoy por hoy no es compatible con Typescript 😅.
¿Qué significa esto a efectos prácticos? Pues que si los desarrolladores de librerías se mueven a ESM, no podremos usar esa librería en proyectos Typescript 🙃
Se espera que para la siguiente versión de TypeScript incluyan soporte, pero hoy por hoy, esta es la situación y, repito, no estamos hablando de si usamos versiones inestables de Node sino todo lo contrario, deberíamos usar en nuestros proyectos Node 14 por ser la LTS activa y si no es así, al menos Node 12 por ser la última LTS con todavía mantenimiento...
Si queréis profundizar más en el tema, te dejo un par de issues de Github donde se discute del problema en detalle: