El compilador de TypeScript

Si acaso te aparece el error:

error TS6053: File 'src/*.ts' not found.
  The file is in the program because:   
    Root file specified for compilation

Se resuelve creando un archivo tsconfig.json.

Pasos:

• 1 Posicionarte en el directorio raíz de tu proyecto.
• Ejecutar el comando “tsc --init”
  • Esto creará el archivo tsconfig.json
• Ejecutar el comando “npx tsc -p ./ -w”
  • Esto compilará en el mismo directorio todos tus archivos .ts
• Modificar el target o el destino (para enviar los compilados a /dist) En el archivo tsconfig.json busca la bandera “outDir” y modifícala para que quede así: “outDir”: “./dist”,

Listo, ya tienes configurado lo necesario para seguir el curso tal cual (hasta el momento).

Nota: El tsconfig ya viene configurado para compilar a ES6, en caso de que quieras cambiar, busca la línea “target” y modifícala con el valor que necesites.

Espero le sirva a alguien.

el nombre Deno surgió de invertir Node… #theMoreYouKnow

El compilador de TS

El código TS no es leído por navegadores ni servidores. Lo que se hace es transpilarlo a JS.

Podemos seleccionar una versión en específico de TS e indicar en dónde queremos que guarde el archivo JS: npx stc src/*.ts --target es6 --outDir dist

O mejor crea un archivo de configuración: tsc --init

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "outDir": "./dist",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  }
}

Si al ejecutar este comando ‘npx tsc src/*.ts --target es6 --outDir dist’, te aparece este error en consola:

Puedes ejecutar el mismo comando, pero en una terminal bash y ya no te aparecerá ese error y la compilación se realizará como lo indica el profesor

Ese tipo de cosas hacen que javascript a veces sea tedioso de usar, typescript resuelve la mayoría de estos casos, ya de los tipos ni hablemos.

A cualquier desarrollador le conviene usar typescript.

También se puede crear un archivo tsconfig.json con la configuración para utilizar tsc

{
  "compilerOptions": {
    "target": "es6",
    "outDir": "./dist"
}

Hola a todos, a los que estan comenzando este curso les recomiendo algo . Cuando usen el comando npx tsc src/demo.ts --target es6 , les recomiendo que en lugar de es6 usen por ejemplo es2021, que fue el que yo use, porque al usar es6 devuelve el archivo demo.js con codigo muy viejo en algunas partes.

No podemos sumar un objeto con un número pero podríamos combinarlos no ? 😛

const rta = {...person, limit};

por fin entiendo porque todo el mundo ama TypeScript

Pendientes a bun.js, que es un nuevo Runtime All-in-One que promete, además de poder correr TypeScript directamente sin necesidad de transpilar a JS (pero sin dejar de soportarlo), viene con su propio bundler, transpiler y cliente npm integrados (retrocompatible con paquetes de Node), con velocidades de ejecución hasta 3 veces mayores (siempre que el servidor esté en la misma región o se use un CDN para los archivos estáticos o Containers para el despliegue de las Apps). Aún está en fase Beta por lo que nos toparemos con algunos bugs en el corto plazo, pero apuesto que en menos de 5 años todos los navegadores van a empezar a ejecutar código TypeScript directamente, y en unos 10~15 años, JS quedará practicamente deprecado, jamás volveremos a ver el caos de JS, preocupados por los types, el código espagueti, los call back hell o el hoisting… El futuro de la Web es casi útopico, como el interfaz USB-C, todo lo que los mil millones de “USB” debieron ser desde el inicio… Que buenos tiempos para estar vivo y trabajar en la Industria Tech :’)
#CursoBunJS-Platzi
#TypeScriptForever

Con npx tsc --init --target es6 pueden crear la configuración para un proyecto en typescript

TS resuelve la mayoria de procesos que llegan a ser algo tediosos en JS

<npx tsc  src/demo.ts --target es6>
<src/*.ts --target es6 --outDir dist> 

Creo que se debería enseñar directamente a usar el ts config para evitar confusiones.

Summary

⚙ In the compilation process of TypeScript; TypeScript compiler (tsc) converts code to ES3/ES5/ES6.
⠀⠀
🤷‍♂️Why it is necessary to do this transpilation/compilation? Well, TypeScript isn’t supported by the browser, and Node.js
⠀⠀
‼👀 Deno it’s a library that is already supported, an alternative to Node.js
⠀⠀
👴 Why older versions? Wheter in case that we need to migrate from Javascript or basically we need to run that code in all the browsers (recommend version would be ES5) 😉

probe la extension .ts con node y ejecuto el archivo .ts
quizas porque es algo muy simple como un console.log

error TS6053: File 'src/*.ts' not found.
  The file is in the program because:   
    Root file specified for compilation

para los que le sale este error, en las ultimas versiones de TS, ya coge todos los archivos por default, solo omitan el ‘src/*.ts’ a mi me funciono así.

Por si no lo notaron, al agregar –target es6 ya no tradujo el const como var , sino ya lo dejo como const

Si en la consola les aparece un error como el siguiente a la hora de ejecutar “npx tsc src/*.ts”

**Cannot find name 'Iterable'.**

Suele solucionarse instalando lo siguiente:

npm install @types/node --save-dev

y mejor aun a Deno y node, existe bun.js!!!

#Hola, comunidad.

Probando el --outDir, no es necesario crear la carpeta, el compilador lo crea por nosotros.

npx tsc src/*.ts --target es6 --outDir dist

Saludos.

En caso de aparecer el error:

error TS6053: File 'src/*.ts' not found.
  The file is in the program because:   
    Root file specified for compilation

Y hayan instalado typescript localmente, solo tienen que usar el comando

npx tsc --init

y seguir los pasos que Pepe Sosa dice en su comentario

El compilador de TypeScript

• Ya que Node y el navegador no son capaces de leer codigo typescript, se necesita hacer un proceso de compilacion a Js que se conoce como Transpilacion.

• Cabe resaltar que se debe indicar la version de Js que se desea obtener, ya que por defecto el compilador entiende que el proceso debe resulta en Es3.

• Se crea el archivo index.ts.

• Se crea el directorio dist, en donde se almacenara el resultado de la Transpilacion.

• Para correr el proceso se utiliza el comando: npx tsc src/*.ts --outDir dist --target es6.

para agregar las configuraciones de outDir y rootDir pueden usar el comando

tsc --init

y desde alli hacer todas las configuarciones.
Tambien pueden visitar mi repo de github y leer el README para ver que comandos pueden ser utilies en TS
Repo para ver los comandos

Dejo mi aporte del codigo realizado

https://github.com/CarlosArgelio/typescript-basic/commit/09ada36781363c2657f84392d401276a10195ccb

✅

const reloj = (hora)=>console.log(`La hora es : ${hora}`; // ACTUALMENTE ESTAMOS USANDO LA SINTAXIS DE ES6 // Para poder compilar el archivo .TS a .JS de Es6 // tenemos que hacer el siguiente comando: // npx tsc nombre.ts --target es6 //TAMBIEN TENEMOS LA OPCION DE INDICAR EN QUE CARPETA VA TRASPILAR //Con el siguiente comando indicamos la carpeta de destino : // npx tsc nombre.ts --target es6 --outDir nombreCarpeta //Tambien podemos decir que compile todos los archivos npx tsc *.ts --target es6 --outDir nombre

error TS6053: File ‘archivo_typescript.ts’ not found.
The file is in the program because:
Root file specified for compilation
Ejecuta: npx tsc -w
luego: npx tsc src/01-hello.ts

Node y el navegador no leen Typescript por defecto!

En el caso de (por algún motivo) tener instalado globalmente TypeScript, se puede cargar las configuraciones en el archivo tsconfig.json especificando el path de donde queremos que tome el codigo "include": ["src/**/*.ts"], el target y directorio de salida.

tsconfig.json

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es6",
    "sourceMap": true,
    "allowJs": true,
    "outDir": "dist"
  },
  "exclude": [
    "node_modules"
  ],
  "include": ["src/**/*.ts"]
}

para que TypeScript tome este archivo y no el global, se puede utilizar el flag --project tsconfig.json desde el directorio root. Si no espeficicamos el archivo de configuracion, TS intentara transpilar con la configuracion global y esto arrogaria errores.
Por otro lado no es compatible el uso del flag --project junto a --target o --outDir.

Como dato por si les interesa saber más de Deno:
Deno es un entorno de ejecución de javascript, al igual que Node.js
Fue creado por el mismo fundador de Node, en sus propias palabras, quizo reconstruir node con lo que no le gustaba de el.

Actualmente pueden probarlo, ya hay una versión estable, funciona directamente con Typescript, tiene cosas propias muy interesantes como el hecho que no tenga permisos por default, no existen los node_modules, etc

No es tan utilizado en la actualidad por diversas causas pero el tema de los modulos es uno de ellos, node propone trabajar con una paquete de librerías instaladas localmente, los “node_modules”, Deno propone utilizar las librerías importando directamente a una URL en vez de tener que instalar localmente las .

import { serve } from "https://deno.land/[email protected]/http/server.ts";

serve(handleRequest);

Si les interesa saber más de este mundo los invito a investigar más sobre el proyecto Deno

Tiene también un servicio de Hosting y ejemplos de aplicaciones web corriendo en Deno

Si aparece algo como “cannot be compiled under ‘–isolatedModules’…” en VS aún cuando todos los problemas de código parecen solucionados,agreguen un:

export {};

Al final.
Eso debería solucionar. 😄

Chicos, les recomiendo esta extension de vs code:
Error Lens

Super útil para ver los errores directamente en el código 😄

el navegador no entiende webasembly?

En el aula de los Lenguajes de programación, JavaScript sería el chico raro. XD

npm i -D typescript
npx tsc
npx tsc --version
npx tsc --init

Suponiendo, que necesitaramos “sumar” un objeto con algún entero o cadena, podriamos hacer destructuring 😃

const rta = {...person,limit};

1. Crear una carpeta en donde vamos a guardar los archivos generados despues de “compilar”
2. Ejecutar el siguiente comando

npx tsc src/*.ts --target es6 --outDir dist

Donde:

src/*.ts: Es la ruta donde estan los archivos .ts
–target es6: Es la version de js con la que se quiere compilar.
–outDir: Es para guardar en otra carpeta los archivos generados al compilar.
dist: la carpeta donde se van a almacenar los archivos generados.