Contenido del curso
El compilador de TypeScript
Sergio Alejandro Trejo Cuxim
Estudiante
Sergio Esteban Diaz Guerrero
Estudiante
Alex Leonardo Rodriguez Carvajal
Estudiante
Francisco Javier Martínez Molina
Estudiante
Diego Quiroz
Estudiante
Alejandro Diaz
Estudiante
Aydee Quispe Mamani
Estudiante
Raul Hernández
Estudiante
Moisés Manuel Morín Hevia
Estudiante
Juan Francisco Cevallos Valdivieso
Estudiante
Ariel Ayala
EstudianteMoisés Manuel Morín Hevia
Estudiante
Irving German Manuel Molano Torres
Estudiante
Isela Reyes Perdomo
Estudiante
Markoz Peña
Estudiante
Isabella Susana
Estudiante
Jorge Cruz Perez
EstudianteMoisés Manuel Morín Hevia
Estudiante
Villegas Hernández Jordán Sinai
Estudiante
Santiago Lopera Naranjo
Estudiante
Lina Katherine Larrea
Estudiante
Alex hernandez mitre
Estudiante
Javi Felices
EstudianteLina Katherine Larrea
Estudiante
Andrea Ysabel Urdaneta Durango
Estudiante
Carlos Guerra
Estudiante
Cesar Roman Santillan
Estudiante
Juan Burns
Estudiante
Erick Alonso
Estudiante
Alex Camacho
Profesor
Juan Osio
EstudianteLina Katherine Larrea
EstudianteCesar Roman Santillan
Estudiante
Ivan Andres Diaz Lopez
Estudiante
David Campos
Estudiante
Mauricio Moreno Morales
Estudiante
Julio Loarte Huerto
Estudiante
Ancizar Arroyo Chávez
Estudiante
German Vera
Estudiante
Miguel Angel Reyes Moreno
Estudiante
Santiago Fitipaldo
EstudianteAlex Camacho
Profesor
Angel Hernandez
EstudianteInstalación de TypeScript
Con el siguiente comando lo instalaremos de manera global:
npm install -g typescript
Consultar la versión del compilador de TS:
tsc -v
Compilar nuestros ficheros .ts
tsc your_file.ts
Compilar de manera 'automática' nuestros ficheros .ts
tsc --watch your_file.ts
No hay que tenerle miedo al TypeScript, ya que este nos creará un archivo: your_file.js. Es decir un archivo .js compatible con todo.
Gracias por la explicación profesor.
Excelente aporte ;) gracias colega.
muchas gracias !
Sí estés en windows y te sale el siguiente error:
aunque hayas ejecutado:
npm install -g typescript
a mi me funciono hacer la siguiente configuración. Abrir Windows PowerShell como administrador y ejecutar:
Set-ExecutionPolicy Unrestricted
Con esto ya puedes usar el comando: tsc desde VS Code
Hola Francko! Me gustaría recomendarte que cheques Windows Subsystem For Linux, Microsoft acaba de liberar la versión 2. Te permite tener un terminal con todo el poder del linux de tu preferencia (Ubuntu, Fedora, etc.). Así no tienes que lidiar con los raros problemas que da el cmd o Powershell en Windows. Estoy seguro que te será de mucha ayuda para seguir con este y más cursos.
Gracias super útil para resolver este problema que también se me presentó.
Si no quisieran instalar typescript de manera global, pueden ejecutar:
npx tsc file.ts
npx tsc --watch file.ts
Para todos los que se preguntan que es npx
Es un comando para ejecutar paquetes de npm que viene con node :)
Oka, entonces esto es un ambiente virtual.
Amigos si no les deja ejecutar desde la terminal del Visual Studio Code, les dejo este video que a mi me funcionó https://www.youtube.com/watch?v=zUszm-f6Xq4 solo al final pongan "Permitir scripts locales y scripts remotos firmados"
También funciona abreviando tsc -w hello.ts
Thanks, lo tendré en cuenta.
Excelente!
Si no les funciona el comendo "tsc", escriban "npx tsc" y ya <3
Buena idea, eso lo que hace es ejecutare el binario directamente
Buen aporte, me sirvió!
Tambien pueden hacer lo siguiente, tener dos ventanas abiertas en VSCode una de ts y la otra de js y observas los cambios en e codigo  17.16.47.png](https://static.platzi.com/media/user_upload/Captura%20de%20pantalla%202020-09-10%20a%20la%28s%29%2017.16.47-38cd0727-5a66-4f93-9a60-91fb898ff393.jpg){kind=small}
Yo uso la terminal xD gracias por el aporte.
muy buen consejo gracias
Una opción para trabar mas rapido, sería tener dos servicios levantados, el "--watch" para compilar TypeScript y "nodemon" para auto ejecutar JavaScript, así cuando uno guardemos cambios en los archivos TS podemos ver el resultado de inmediato en JS Ejemplo: tsc --watch hello.ts/ nodemon hello.js
Totalmente. Y ya generando un script de node sería mucho más fácil el proceso de levantar o incluso mandar a producción el archivo :-)
tip de PRO.
Aunque **Powershell **es muy poderosa, hay otras opciones para los que usamos Windows, desde Powershell Core, que es multiplataforma, hasta Terminal, la nueva terminal para Windows 10, o una de las mejores opciones es Git Bash, cuando instalas Git en Windows tienes la opción de instalar esta terminal, por defecto está marcada, y funcionan los comandos Unix, en el caso de Luis que usa MAC, serán los mismos.
Otras opciones son ConEmu, o su versión más ligera cmder.
A mi Git Bash me encanta. Lo único es que siento que no se puede personalizar tanto como las terminales de Mac o Linux T_T
Typescript debe ser compilado al ser un archivo con un extensión como file.ts al ser compilado nos genera los archivos file.js ya que los navegadores no entienden TypeScript sino JavaScript 😊
Loveu ❤ TypeScript por poner orden
Si en Mac les aparece este error:
Sólo ejecuten la siguiente Instrucción: $ sudo chown -R $USER /usr/local/lib/node_modules
super! me ahorraste la busqueda inparable 👌
A mi me funciono en windows, porque será?
No olviden usar el Sudo al correr el comando de instalación
sudo npm install -g typescript
🥽 Entorno de desarrollo
El compilador de TypeScript
Para comenzar a trabajar con TypeScript se necesita tenerlo instalado de forma global en nuestro sistema, eso se logra a través del comando npm install -g typescript el cual nos instalará la versión más reciente, para comprobar que versión se instaló y que lo hemos instalado de forma correcta utilizamos el comando tsc -v.
Una vez que se tiene instalado TypeScript ya se puede comenzar a trabajar con él. Hay que recordar que los navegadores no reconocen este código por lo tanto toca transpilarlo a JavaScript. El comando tsc filename.ts realiza esta acción.
Por otro lado también tenemos este comando tsc --watch filename.ts que cada vez que salvemos cambios nos transpilará nuestro archivo de TypeScript a uno de JavaScript.
Me encanta la manera en que has organizado las últimas clases en un solo archivo. Te tomo la palabra y voy a organizar mis apuntes así también :-)
que buen resumen! muchas gracias
es decir, tsc es para compilar una sola vez. y Watch es para ir actulizando el mismo archivo?
Sí, con Watch el archivo se compilará automáticamente cuando haya cambios en él.
Los watchers son comunes en una gran cantidad de compiladores o transpiladores, y funcionan de modo que detectan cuando haces un guardado en algún archivo (sea que presiones ctrl + s) y en el momento que detectan cambios transpilan el archivo que fue alterado.
Si les sale este error al ver la versión del TSC:
Get-ExecutionPolicy
Set-ExecutionPolicy Unrestricted
Con eso solucione el inconveniente que tenia al utilizar Windows Terminal. Espero les sirva.
Muchas gracias, Me sirvió!!!
Hasta ahora se entiende jeje
El compilador de TypeScript
Para instalar esta herramienta debemos hacer npm i -g typescript. La bandera "-g" significa "global" y podremos usar el TSC en nuestros diferentes proyectos. Una vez instalado podemos hacer tsc -v para comprobar qué versión tenemos en nuestro equipo.
¿Cómo funciona el TSC? Tenemos por ejemplo un archivo "hello.ts", el TSC lo tomará y creará un archivo "hello.js". De manera práctica podemos hacer tsc hello.ts
Luego podemos ejecutar el archivo de JavaScript con Node, haciendo node hello.js.
Tenemos la opción de "--watch", lo cual significa que con solo guardar los cambios en el archivo TS, estará modificando automáticamente el archivo JS, simplemente escribimos tsc --watch hello.ts.
Por si les es de ayuda, si al ejecutar el comando 'npm install -g typescript' en MAC reciben un error de EACCES, simplemente ingresen el comando 'sudo npm install -g typescript' para autorizar el acceso a la carpeta donde NPM instala las dependencias globales. A mi me funciono.
Hola Santiago, Muchas gracias por el aporte. Sigue aportando contenido valioso para la comunidad de esta forma👌 ¡Nunca pares de aprender! 💚
otra buena opcion para usar el watcher y no tener que estar compilando manualmente los archivos que modifiquemos es
tsc -w *.ts
Esto en la carpeta donde tengamos los archivos ts
