node.js - ¿Cómo ejecuto TypeScript en modo watch y el servidor al mismo tiempo?

Estaba desarrollando mi proyecto en nodejs. Descubrí que si necesito codificar y probar la API, tendré que ejecutar dos consolas, una para ejecutar el watch de typescript y otra para ejecutar el servidor.

Creo que es tan problemático. Encuentro que otros desarrolladores en GitHub han escrito scripts en package.json. Es fácil llamar a cualquier comando. Atrae cómo escribir los scripts y simplifica mi flujo de trabajo de desarrollo.

En resumen, el comando de TypeScript watch es tsc -w y el comando para ejecutar el servidor es node app.js. Mi idea es combinar los comandos como tsc -w & node app.js pero no puedo hacer que los dos comandos funcionen al mismo tiempo. ¿Cómo lo hago? Gracias.

Respuesta #1

Opción 1

Paso 1

instala concurrently, usa npm, pnpm o yarn

pnpm i concurrently -D   

Paso 2

crear un script con este comando

"scripts": {
    "run": "tsc && concurrently \"tsc -w\" \"nodemon dist/app.js\"",
}

Opción 2

sin instalar nada (Mac o Linux)

"scripts": {
    "run": "tsc -w & nodemon dist/app.js",
}

Nota: Ejecute tsc primero para que su directorio dist tenga algo al momento de ejecutar nodemon.

Y con eso tendrás tu aplicación de Typescript en ejecución

Respuesta #2

Mi idea es combinar los comandos como tsc -w & node app.js, pero no puedo hacer que los dos comandos funcionen al mismo tiempo. ¿Cómo lo hago?

Tienes algunas opciones. La más simple es usar ts-node-dev : https://github.com/whitecolor/ts-node-dev

Respuesta #3

En resumen, si te gusta nodemon, esta es una manera sencilla de obtener vigilancia de archivos, compilación y ejecución:

nodemon --ext ts --exec 'tsc && node dist/index.js'

Opcionalmente reemplaza tsc con babel para una compilación más rápida.

Aquí hay un ejemplo más completo, en package.json (con mapas de origen):

"scripts": {
  "develop": "nodemon --ext ts --exec 'yarn build --incremental && yarn serve'",
  "build": "tsc",
  "serve": "node --require source-map-support/register dist/index.js",
  ...
},

Instala source-map-support como una dependencia si quieres, ejem... ¡soporte para mapas de origen! De lo contrario, elimina --require source-map-support/register del script serve arriba.

tsconfig.json

{
  "compilerOptions": {
    ...
    "sourceMap": true,
    "outDir": "dist",
  }
}