No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Introducci贸n

24/42
Recursos

TypeScript es un superset de JavaScript que a帽ade tipos a nuestras variables ayudando as铆 a la detecci贸n de errores de forma temprana y mejorando el autocompletado.

Los navegadores no entienden TypeScript as铆 que lo vamos a transpilar a JavaScript usando Parcel.

Aportes 135

Preguntas 61

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Reg铆strate o inicia sesi贸n para participar.

Apuntes de la clase:

Para todos aquellos que tienen el error 鈥楿ncaught ReferenceError: regeneratorRuntime is not defined鈥, espero lo puedan resolver como yo pude:

  1. En primer lugar, gracias a esta fuente, me di cuenta de que el problema ten铆a que ver con la parte de 鈥渂rowserslist鈥 del package.son, aseg煤rense de no tener un typo ah铆. 脡se fue mi primer error. Debe quedar as铆:
"browserslist": [
    "last 1 chrome version"
  ]
  1. Cre铆a haber resuelto el problema, pero cuando recargaba la p谩gina, me segu铆a apareciendo el mismo error:

Entonces, al ver que el problema ten铆a que ver con los service workers, proced铆 a eliminarlos de la memoria del navegador:

隆Y funcion贸! Ya pod铆a recargar la p谩gina las veces que quiera sin el error:

Al final, entend铆 que el error lo hab铆a originado cuando hab铆a abierto la url del video (http://localhost:1234/index.html) teniendo el typo en 鈥渂rowserslist鈥. Parece que ese error se hab铆a quedado guardado en los service workers (es mi razonamiento). Cuando correg铆 el error y elimin茅 los service workers, todo funcion贸.

Espero les sirva porque a m铆 me sac贸 canas verdes. 隆Suerte!

Hola gente de 2021

Hay un problema con la version 1.12.4 de Parcel por lo que si intentas hacerlo tal como sale en el video no te va a funcionar, asi qeu debes instalar la version anterior.
Para hacerlo ejecuta los siguientes comandos en tu terminal:

npm uninstall parcel-bundler
npm i --save-dev [email protected]

Este video me ayudo a entender mejor que es TypeScript, lo dejo por aqu铆 por si a alguien le es util

TypeScript

TypeScript es un lenguaje de programaci贸n libre y de c贸digo abierto desarrollado y mantenido por Microsoft. Es un superconjunto de JavaScript, que esencialmente a帽ade tipos est谩ticos y objetos basados en clases. Anders Hejlsberg, dise帽ador de C# y creador de Delphi y Turbo Pascal, ha trabajado en el desarrollo de TypeScript.1鈥 TypeScript puede ser usado para desarrollar aplicaciones JavaScript que se ejecutar谩n en el lado del cliente o del servidor (Node.js).

TypeScript extiende la sintaxis de JavaScript, por tanto cualquier c贸digo JavaScript existente deber铆a funcionar sin problemas. Est谩 pensado para grandes proyectos, los cuales a trav茅s de un compilador de TypeScript se traducen a c贸digo JavaScript original.

Introducci贸n

Para que los programas sean 煤tiles, necesitamos poder trabajar con algunas de las unidades de datos m谩s simples: n煤meros, cadenas, estructuras, valores booleanos y similares. En TypeScript, admitimos casi los mismos tipos que esperar铆a en JavaScript, con un tipo de enumeraci贸n conveniente para ayudar a las cosas.

TypeScript en 5 minutos

Comencemos creando una aplicaci贸n web simple con TypeScript.

Instalaci贸n de TypeScript

Hay dos formas principales de obtener las herramientas TypeScript:

  • V铆a npm (el administrador de paquetes Node.js)
  • Al instalar los complementos de Visual Studio de TypeScript

Visual Studio 2017 y Visual Studio 2015 Update 3 incluyen TypeScript de forma predeterminada. Si no instal贸 TypeScript con Visual Studio, a煤n puede descargarlo .

Para usuarios de NPM:

> npm install -g typescript

Construyendo su primer archivo TypeScript

En su editor, escriba el siguiente c贸digo JavaScript en greeter.ts:

function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

document.body.textContent = greeter(user);

Compilando su c贸digo

Utilizamos una .tsextensi贸n, pero este c贸digo es solo JavaScript. Podr铆a haber copiado / pegado esto directamente desde una aplicaci贸n JavaScript existente.

En la l铆nea de comando, ejecute el compilador TypeScript:

tsc greeter.ts

El resultado ser谩 un archivo greeter.jsque contiene el mismo JavaScript que usted introdujo. 隆Estamos funcionando con TypeScript en nuestra aplicaci贸n JavaScript!

Ahora podemos comenzar a aprovechar algunas de las nuevas herramientas que ofrece TypeScript. Agregue una : stringanotaci贸n de tipo al argumento de la funci贸n 鈥榩ersona鈥 como se muestra aqu铆:

function greeter(person: string) {
    return "Hello, " + person;
}

let user = "Jane User";

document.body.textContent = greeter(user);

Numero

Como en JavaScript, todos los n煤meros en TypeScript son valores de coma flotante. Estos n煤meros de coma flotante obtienen el tipo number. Adem谩s de los literales hexadecimales y decimales, TypeScript tambi茅n admite literales binarios y octales introducidos en ECMAScript 2015.

let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;

Ey chicos me tome el tiempo para traerles las mejores notas del curso, denle una checada porfavor a mis notas, y si son de su agrado dejenme un like en github. Saludos 馃槃
Notas o https://github.com/JasanHdz/javascript-professional/tree/master/notes

Ahora recuerdo las palabras de freddy, si te gusta Java, usa Angular, si te gusta JavaScript, usa React

Hola a todos. Para los que usan Firefox, esta es la confi para el browserList:

"browserslist": [
    "last 1 Firefox version"
  ]

esta versi贸n de parcel funciona bn!!


desinstala la que no te funciona

npm uninstall parcel-bundler

instala esta

npm i --save-dev [email protected]

Para eliminar directorios en windows usen:

rd ".cache" -s
rd "dist" -s

A alguien m谩s NO le funciona la auto recarga? rengo que ejecutar NPM start cada vez que hago un cambio

Les recomiendo que pongan las carpetas node_modules .cache y dist en el archivo .gitignore y se van a evitar muchos problemas con git. realice commit de estos archivos sin adicionarlos y despu茅s si lo adicione, ahora git no me ignora esas carpetas y tengo varios conflictos con los archivos por mi desconocimiento鈥

Me cans茅 de que no ande el server. Directamente vayan al market de extensiones de VS Code y bajen 鈥楥ompile Hero鈥. Con eso los archivos ts que requieran compilar谩n autom谩ticamente. Luego en el html deben llamar a los scripts ya compilados a js

Quizas ya es un poco tarde en el curso para esta recomendacion pero Hay un pluggin de LIVE-SERVER en VS CODE lo recomiendo, me ha funcionado perfecto

https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer

si ha alguien le da el error siguiente!

Server running at http://localhost:1234 
馃毃  /assets/sw.js: ENOENT: no such file or directory, open '/assets/sw.js'
Error: ENOENT: no such file or directory, open '/assets/sw.js'

en su **index.js en navigator.serviceWorker.register(鈥./sw.js鈥) eliminen el ./ de sw.js. **
Quedando correcto de la siguiente forma:

if( 'serviceWorker' in navigator ){
  navigator.serviceWorker.register('sw.js')
    .catch( e => {
      console.log(e.message)  
    });
}

Me parece fant谩stico que a帽adan una secci贸n de typescript a este curso!

Uhh genial! Esto es lo que yo quer铆a en JavaScript, un poco de tipado ya que PHP si maneja tipado, conoc铆a TypeScript pero no me hab铆a animado a aprenderlo jaja

!!IMPORTANTE !!!
con respecto al error que se genera cuando se ejecuta el npm start es porque el profesor creo que se salto el npm install parcel y ahora si pueden instalar el que indica el profesor que es una herramienta derivada del parcel segun entendi. npm install -D parcel-bundler

!! SALDRA UN 2DO ERROR CON EL SW el siguiente y el mismo servidor nos da una sugerencia.

seria corregir en el archivo /assets/index.js la parte de serviceworker asi, se reemplaza la url ya que no es soportado por la libreria y algunos navegadores, a mi me funciona edge super bien, chrome dev no me carga el video.

if(鈥榮erviceWorker鈥 in navigator) {
navigator.serviceWorker.register(new URL(鈥/sw.js鈥, import.meta.url),
{type: 鈥榤odule鈥檥).catch(error => {
console.log(error.message)
})
}

ya ni s茅 que es lo que mi computadora tiene o no tiene instalado. F

Yo lo que hago, para evitar errores, es instalar typescript globalmente en mi computadora.

npm install -g typescript

Y luego me ubico en la carpeta de typescript y en la consola se ejecuta el watcher del CLI de typescript.

tsc *.ts -w

y en el index.html se hace referencia a index.js el cual se crea automaticamente cuando se hacen cambios en el archivo index.ts.

Lo que sucede es que se transpila el codigo de typescript a javascript que el navegador entienda.

npm install -D [email protected]

Esta es la versi贸n de parcel que tienen que instalar, y asegurense que vaya dirigido a index.html, yo intent茅 hacerlo a otro archivo y no me dejo.

Tambi茅n si lo van a subir a un repositorio git, necesitaran un gitignore que tenga lo siguiente:

node_modules
.parcel-cache

Modifique package.json con lo indicado en la clase al ejecutar npm start me arroja esto 馃槮 ayuda!

Probando la configuraci贸n que nos da el instructor me encuentro con el mismo problema que veo se ha presentado a varios de los alumnos: no se encuentra el archivo sw.js

Intent茅 modificar la l铆nea para dejarla as铆:

navigator.serviceWorker.register('../sw.js')

Lo que hice fue copiar el archivo sw.js al directorio assets y ah铆 s铆 funcion贸.

驴Ser谩 esa una soluci贸n correcta?

Supongo que no, pero funcion贸. Por favor si alguno tiene una mejor soluci贸n. Gracias

Hola, llevo horas para que me funcione el condenado parcel, al final lo solucion茅, les comparto qu茅 hice:

npm uninstall parcel-bundler
rm -rf .cache dist
npm cache clean --force
npm install -D [email protected]

y finalmente en el package.json, en el script, borr茅 鈥渆jercicios/index.html鈥, qued谩ndome as铆:

鈥渟cripts鈥: {
鈥渟tart鈥: 鈥減arcel index.html ejercicios/**/*.html鈥
},

Espero le sirva a alguien.

Tuve 2 problemas en esta clase. Para empezar parcel-bundler ya no es mantenida, si no que ahora hay otro paquete que se llama Parcel el cual tiene la misma funci贸n que parcel-bundler. Adem谩s con parcel el service worker me daba errores, para esto en la documentaci贸n de parcel se encuentra la manera en la que se tienen que configurar los service workers. Espero que les ayude! 馃挌

Que dolor de cabeza, con sw, me toco quitarlo

Tengo un problema a la de correr con el comando 鈥渘pm start鈥 me carga el v铆deo del proyecto (curisosamente cuando se carga el local host me lanza el proyecto del video de una vez, no es como Richard lo hace en el video de la clase) que estamos realizando pero a la hora de realizar el cambiar al proyecto de TS me carga el v铆deo del primer proyecto es como si no reconociera lo otro. Alguien sabe como solucionar ese problema?

Soy fan de los lenguajes tipados

class Person implements personInterface {
	//propeties
	nombre: String;
	edad: Number;

	//construct
	constructor(nombre: String, edad: Number) {
		this.nombre = nombre;
		this.edad = edad;
	}

	//method
	imprimirDatos() {
		console.log(`Mi nombre es ${this.nombre} y tengo ${this.edad}`);
	}
}

//instance
var marino = new Person('marino pablo', 22);
marino.imprimirDatos();

A alguien mas le sali贸 un error en el modulo del service worker?

鈥淯ncaught ReferenceError: regeneratorRuntime is not defined鈥

saben a que se debe?

parcel-bundler es la version 1 de Parcel y est谩 deprecada, por eso salen tantas vulnerabilidades. Yo us茅 la version 2 que se instala escribiendo en terminal npm i parcel.

**Documentacion de como migrar
**https://parceljs.org/getting-started/migration

Gente del futuro 2022:

 "browserslist": {
    "modern": [
      "last 1 edge version",
      "last 1 firefox version",
      "last 1 chrome version"
    ]
  },

Nunca traduzcas!!!

Qu茅 frustrante esto T-T ya he intentado todo y nada me funciona, nisiquiera me sale un error, simplemente ejecuto el comando npm start y me corre normal pero entro al puerto del local host y no aparece nada, es desalentador.

Est谩 cool TypeScript, pero personalmente cre贸 que hubiera estado mejor que hubiera sido algo implementado por los de W3C en alguna versi贸n de ECMAScript. Algo parecido a lo que hicieron en Python, que lo implementaron en el lenguaje, pero igual est谩 cool.

Les ha pasado que Live-server inicia pero no hace el reload automaticamente?

Les comparto mi .gitignore para que lo tengan en cuenta antes de hacer un commit para que no se les suban varios archivos del build

node_modules/*
*.mp4
*.cache
dist

el service worker debe tener una nueva configuracion chicos! Seria este https://parceljs.org/languages/javascript/#service-workers

if ('serviceWorker' in navigator) {
    window.addEventListener('load', function() {
      navigator.serviceWorker.register(
      new URL('sw.js', import.meta.url),
      {type: 'module'}
      
      ).then(function(registration) {
        // Registration was successful
        console.log('ServiceWorker registration successful with scope: ', registration.scope);
      }, function(err) {
        // registration failed :(
        console.log('ServiceWorker registration failed: ', err);
      });
    });
  }

En este link se puede descargar el Handbook de TypeScript. 馃憤

TypeScript Handbook

Hola.
驴A alguien le sucede que no se imprime el console.log("Hello TypeScript");?

![](

compa帽[email protected] apesar de cambiar de ruta en el navegador me sigue reproduciendo el video y no me muestra el console.log es claro que no me esta corriendo el index.ts como puedo solucionar eso :S???

    "start": "parcel index.html ejercicios/index.html ejercicios/**/*.html"

Es lo mismo typescript que Angular? He visto c贸digo escrito en Angular y es tal cual typescript, mas no s茅 si es lo mismo.

por accidente instale parcel mientras la terminal estaba ubicada en mi home, creen que sea problema?

Como se gusta TS, esta muy bueno hay que aprender mas de este lenguaje

Comando en la terminal si no esta cargando el index.html de la carpeta de ts rm -rf .cache dist

Si tienes este error en consola: 鈥楿ncaught ReferenceError: regeneratorRuntime is not defined鈥
Aqu铆 la respuesta

Hola. Estoy teniendo problemas con el npm start. Esto es lo que me sale en el terminal:

Este es mi package.json:

{
  "name": "platzi-media-player",
  "version": "1.0.0",
  "description": "Proyecto del Curso Profesional de JavaScript de la Escuela de JavaScript",
  "license": "MIT",
  "author": "Mr. Joshi",
  "keywords": [
    "platzi"
  ],
  "scripts": {
    "start": "parcel index.html ejercicios/index.html ejercicios/**/*.html"
  },
  "devDependencies": {
    "live-server": "^1.2.1",
    "parcel-bundler": "^1.12.4"
  },
  "browserslist": [
    "last 1 Chrome version"
  ]
}

Si alguien me puede ayudar le estar铆a muy agradecido

Hola camaradas digitales:

  • En 2022 podemos instalar: npm install -D parcel-bundler
  • El 煤nico pero es en nuestro archivo sw.js y debemos comentar esta parte:
async function precache() {
    const cache = await caches.open(VERSION) // abrimos el cache
    return cache.addAll([ // a帽ademe estes archivos
        // '/',
        // '/index.html',
        // '/assets/index.js',
        // '/assets/MediaPlayer.js',
        // '/assets/plugins/AutoPlay.js',
        // '/assets/plugins/AutoPause.js',
        // '/assets/index.css',
        // '/assets/BigBuckBunny.mp4',
    ]) // return porque arriba tenemos una promesa esperando respuesta
}

NO haria falta borrar nada, a menos que comenta un typo, entonces hagan todo lo de borrar del video e incluso desistalen el service worker. 脡xitos.

No logre instalar parcel, me genera errores lo que hace el profe en esta clase.

Estaba teniendo problemas para usar el parcel bundler, para solucionarlo hice el siguiente cambio en el codigo del archivo index.js

navigator.serviceWorker.register('/sw.js')

Lo cambie por

navigator.serviceWorker.register(new URL('/sw.js', import.meta.url))

Envi茅 la URL del service worker usando el objeto URL

Yo lo hice de la siguiente manera:
Instale typescript en el proyecto como una dependencia de desarrollo as铆:

npm i --save-dev typescript

Luego cree la carpeta typescript dentro de ejercicios y luego el archivo index.js.
Por 煤ltimo en el archivo package.json cree el siguiente script:

"start": "tsc ejercicios/typescript/index.ts"

y as铆 se compila mi archivo a .js
-nota: yo use la extenci贸n de live server de vsc

Les comparto un video que me ayudo a entender mejor para que es TypeScript
https://www.youtube.com/watch?v=wXBl5tZm-OQ

crea la instruccion en package.json para ejecutar TS con parcel adicionando las rutas de los html's que van a usar del script

Yo utilizo parcel en mi trabajo para producir archivos JavaScript con el c贸digo ofuscado y comprimido.
Les dejo un ejemplo de como lo utilizo tomando el detalle de que puedo darle indicarle que solo lo haga con los archivos que empiecen por cierto nombre (Platzi seria la palabra clave con la que empieza cada arrchivo como Platzi-index.js), tambi茅n evito el source-map ya que cada archivo lo necesito independiente esto quedar铆a algo as铆:

// --out-dir es el directorio destino (./build) y seguido la ruta donde tomara los archivos (./src/js/Platzi-*.js")
parcel build --no-source-maps --out-dir ./build ./src/js/Platzi-*.js"

Hola, para aquellos que el live-server s铆 carga pero no se autorrecarga, intenten correr el comando npm start desde el cmd y no desde ubuntu.

Buen dia campeon鈥

tuve un par de errores, nada complicado鈥

[visita esta pagina](https://quizdeveloper.com/faq/typeerror-the-path-argument-must-be-of-type-stringdot-received-undefined-aid148 "visita esta pagina")

鈥渂rowserslist鈥: [
鈥渓ast 1 chrome version鈥
]

SOLUCION A ERROR ENOENT

Okay esto fue demasiado frustrante. Tarde una hora en poder arreglar el funcionamiento con parcel.
Hice lo siguiente:

  • Primero descargue el parcel v2

  • Luego me salia un error: el error decia que no lograba acceder al index.js desde el index.html principal,

  • Fui a este y note que tenia /javascript-profesional/assets/index.js
    esto queria decir que estaba intentando acceder a
    una carpeta con ruta javascript-profesional/javascript-profesional
    Esto obviamente era un error, solo quite javascript-profesional y listo

Para los amigos que esten trabajando este curso noviembre 2021, instalen de forma normal el parser, funciona perfectamente

Resumen de la clase
Es un super set de JavaScript, nos permite a帽adir tipado a nuestras variables y funciones.
Al hacer esto, TS nos permite detectar errores de manera temprana, mejora el auto completado y nos va a dar herramientas que har谩n el desarrollo mas agradable y seguro.
La herramienta parser nos permite transpilar TypeScript a JavaScript.
Comando: npm install -D parcel-bundler
Cambiamos el start del archivo npm:鈥漰arcel index.html ejercicios/index.html ejercicios//**/*.html
Si queremos que transpile para el navegador reciente agregamos la siguiente configuraci贸n en package.json
Browserslist:{鈥渓ast 1 Chrome versi贸n鈥潁
Pata quitar liver-server comando: npm rm live-server
Para a帽adir typescript:
En ejercicios creamos la carpeta TypeScript:
Dentro la carpeta index.html e index.ts

console.log("hi typescript");

function agregar(a:number,b:number){
    return a+b;
}

const valor = agregar(1,3);

bueno para el que le dio errores al instalar el transpilador que usa el profesor en la clase les recomiendo que se bajen el git para poder usar git bash y los comando NPM, despues instalan de manera global typscript en git bash con npm install -g typescript
despues se desplazan a su carpeta de proyecto y ejecutan tsc -w *.ts con esto estara en modo escucha el typescript y transpilara su archivos TS a JS de manera automatica cada que hayan cambios

Hoy 15/09/2021 , tuve que instalarlo asi

npm uninstall parcel-bundler
npm i --save-dev [email protected]

Luego hacer muchas piruetas para que me funcionara, me la he pasado todo el curso explorando funcionalidades externas para alcanzar los objetivos en muchos videos.

Pero all铆 vamos

Si en el package.json a帽adis el script 鈥渃leanup鈥 y 鈥渟tart鈥 de esta forma, se borraran las carpetas .cache y dist automaticamente cada vez q inicieis parcel

"cleanup": "rm -rf .cache dist",
    "start": "npm run cleanup && parcel ./index.html index.html ejercicios/index.html ejercicios/**/*.html"

Bueno, les comparto mi experiencia:
Ten铆a un error de Build Error el cual no sab铆a por donde era y despu茅s de literalmente revisar todo un d铆a quise descansar para retomar al d铆a siguiente. Lo que hice despu茅s fue comparar mi c贸digo con los archivos del profesor y verificar que estuviera igual, ya que vengo siguiendo el curso exactamente como lo ha hecho 茅l. Despu茅s de haber verificado eso, haber borrado las carpetas 鈥.cache鈥 y 鈥榙ist鈥, verificar el Storage Data en el inspector y actualizar con ctrl+shift+r; o sea, hacer una 鈥渓impieza鈥 de data, ejecut茅 el servidor desde VSCode y no desde la terminal que proporciona Git. Y ahora est谩 funcionando, ya recargu茅 de nuevo, hice todo el proceso de nuevo y est谩 corriendo, incluso el v铆deo que antes no reproduc铆a. En conclusi贸n si pueden corran el servidor con VSCode y no con la terminal, igual ya est谩 corriendo y si sale otro error verificar茅 la fuente, por lo que no pienso 鈥渁veriguar鈥 por qu茅 no funcionaba. Recuerden 鈥渟i funciona no lo muevan鈥 :3 SALUDOS!!! 馃槃

Advertencia para todos los usuarios que est茅n haciendo esto desde el 08/2021 en adelante

  1. Para instalar el parcel-bundler sigue estos pasos, los pasos del video ya tan viejitos
npm i -D [email protected]1.12.3
  1. Si por alg煤n maquiav茅lico motivo no te funciona mas el proyecto como al profe,

    no te alarmes pira帽a, en el video 26 vas a corregir las cosas que se te rotieen aca xd.
    Suerte y sigue tranquilo estudiando 鉂わ笍

Me sale este error 馃槮

Si no les funciona el console.log("Hello, TypeScript "); como al profesor, deben apagar su servidor, descargar otro paquete que es el de typescript con el siguiente comando: npm install --save-dev typescript y volver a encender su servidor.

驴Qu茅 es TypeScript y por qu茅 utilizarlo?
https://www.youtube.com/watch?v=ch09uKQBxo0

Para los que le sale el error Support for the experimental syntax 鈥榗lassPropierties鈥 isn鈥檛 currently enabled
Instalar:
npm install @babel/preset-env --save-dev
npm install --save-dev @babel/plugin-proposal-class-properties

Luego crear en el root del proyecto el archivo .babel.rc
dentro de este archivo agregar estas lineas:
{ "presets": ["@babel/preset-env"], "plugins": ["@babel/plugin-proposal-class-properties"] }

Es un superset de JS. Permite anadirle tipad a nuestras variables y funciones. En JS no suele hacerse eso, pero la realidad es que ganamos mucho detectando errores de forma temprana y nos ayuda con herramientas que el desarrollo sea mas agradable y mas seguro. Live server no nos deja usar TypeScript, tenemos que usar una herramienta llamada Parcel, que instalamos desde NPM.

Despues de instalarlo con el comando:

sudo npm install -D parcel-bundler

Tendremos que modificar el JSON diciendole que

"browserslist":[
    "last 1 Chrome version"
  ],
"scripts": {
    "start": "parcel ./website/index.html ./typescript/*`.html"
  },

Ya con eso podremos usar el NPM START para poder iniciar el servidor y converitr TYPESCRIPT y utilizarlo en el navegador.

Podemos ver que es muy parecido a JS, por ejemplo las diferencias para poder hacer una funcion usamos

function add(a:number, b:number) {
	return a+b;
}

Asi vemos como tenemos que declarar un tipo de valor para que este funcione y si lo declaramos podremos ver que el cursor nos indica que tipo de funcion es, esto es porque TS le hace un analisis estatico.

demasiados errores con este nuevo server! a mi me carga la pagina de video en la ruta de http://127.0.0.1:1234/ejercicios/typescript/index.html y ya elimine todo los datos del navegador, las carpetas .cache y dist y volvi a levantar el server y nada!

este es mi package.json

{
  "name": "platzi-media-player",
  "version": "1.0.0",
  "description": "Proyecto del Curso Profesional de JavaScript de la Escuela de JavaScript de Platzi.",
  "license": "MIT",
  "author": "Richard B. Kaufman L贸pez <[email protected]>",
  "keywords": [
    "platzi"
  ],
  "scripts": {
    "start": "parcel index.html ejercicios/index.html ejercicios/**/*.html"
  },
  "devDependencies": {
    "parcel-bundler": "^1.12.3",
    "typescript": "^3.5.3"
  },
  "browserslist": [
    "last 1 Chrome version"
  ],
  "dependencies": {
    "@sparragus/platzimediaplayer": "^1.0.0"
  }
}


Parcel nunca me funcion贸, en verdad da mucho que desear

Buena clase!

Viniendo de Java, creo que esto me va a gustar 馃槃 soy de los que prefieren lenguaje fuertemente tipados.

Tengo un problema que no me carga las ruta unicamente me carga la ruta del playzi video independientemente de lo que coloque en mi Url es platzi video D: ?

Alguien sabe por qu茅 mi server se queda colgado y no carga? No me aparece ning煤n error

Hola, al cargar la pagina del video (http://localhost:1234/index.html), me sale este error en consola:
鈥淯ncaught (in promise) TypeError: Request failed鈥.
Y otra cosa, el Service Workers que hicimos en la anterios classe ya degado de funcionar.

Se soluci贸n en los pr贸ximos v铆deos? Alguien me puedes ayudar por favor, gracias

驴A que se refiere con que TypeScript ayuda a mejorar el autocompletado?

La consola no me deja ejecutar ning煤n comando, no s茅 porqu茅. Alguien que me ayude a salir de esto?

Magia negra? 馃捇鉁
Al final me sali贸 siguiendo las instrucciones

estupendo, lo hab铆a escuchado pero jamas pens茅 que era tan genial

Yeih

驴Parcel es una alternativa a Webpack?

Importante para que el servidor arranque

Otra excelente forma de a帽adir tipado a nuestro c贸digo Javascript es usando Flow

How to Install Parcel for the compilation of TypeScript

Hola! tengo el siguiente error: Failed to load module script: The server responded with a non-JavaScript MIME type of 鈥渢ext/html鈥. Strict MIME type checking is enforced for module scripts per HTML spec.
驴Alguien sabe como puedo solucionarlo?

隆Ayuda! tengo este error al ejecutar 鈥渘pm test鈥:

npm ERR! Linux 4.15.0-65-generic
npm ERR! argv "/usr/bin/node" "/usr/bin/npm" "install" "typescript" "-D"
npm ERR! node v8.10.0
npm ERR! npm  v3.5.2
npm ERR! code ENOSELF

npm ERR! Refusing to install typescript as a dependency of itself
npm ERR! 
npm ERR! If you need help, you may report this error at:
npm ERR!     <https://github.com/npm/npm/issues>

npm ERR! Please include the following file with any support request:
npm ERR!     /home/leonardo/github/Platzi/typescript/npm-debug.log
馃毃  /home/leonardo/github/Platzi/typescript/typescript.ts: Failed to install typescript.
    at PromiseQueue.install [as process] (/home/leonardo/github/Platzi/typescript/node_modules/parcel-bundler/src/utils/installPackage.js:46:11)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)```

驴Tienen el nuevo npm de parcel? Me figura solo el yarn en la documentaci贸n

Alguien que me pueda orientar, en todas las rutas siempre me pone el mismo video. le antepuse. con ./ con / o sin ninguna de las anteriores siempre pasa lo mismo鈥
entro a la ruta http://localhost:1234/index.html/ejercicios/index.html y sigue reproduciendose el video鈥

Alguna Sugerencia?

typescript es una buena ayuda.

Pueden explorar un poco la documentacion de TypeScript: Click aqui

Perfecto, avanzamos

tengo el siguiente error:
![](

驴Alguien seria tan amable de ayudarme? 馃槄

TypeScript es un superset de JavaScript que a帽ade tipos a nuestras variables ayudando as铆 a la detecci贸n de errores de forma temprana y mejorando el autocompletado.

Los navegadores no entienden TypeScript as铆 que lo vamos a transpilar a JavaScript usando Parcel.

Me aparecen estas vulnerabilidades al remover el live-server, de qu茅 se tratan?
npm WARN rollback Rolling back [email protected] failed (this is probably harmless): EINVAL: invalid argument, scandir '/mnt/d/Proyectos/javascript-profesional/node_modules/fsevents/node_modules/node-pre-gyp/lib/util/nw-pre-gyp鈥
npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {鈥渙s鈥:鈥渄arwin鈥,鈥渁rch鈥:鈥渁ny鈥潁 (current: {鈥渙s鈥:鈥渓inux鈥,鈥渁rch鈥:鈥渪64鈥潁)

Esta muy bien el Parcel, me funcion贸 sin problemas

es [email protected]#$$%^ frustrante no saber que hacer en este caso, si alguien sabe que hacer le agradecer铆a :

~/documents/github/js-projecto/website(master*) 禄 npm start                                                                                                           [email protected]

> [email protected]1.0.0 start /Users/hydra/Documents/GitHub/JS-projecto/website
> parcel /index.html ejercicios/index.html ejercicios/**/*.html

Server running at http://localhost:1234 
馃毃  No entries found.
    at Bundler.bundle (/Users/hydra/Documents/GitHub/JS-projecto/website/node_modules/parcel-bundler/src/Bundler.js:275:17)
    at async Bundler.serve (/Users/hydra/Documents/GitHub/JS-projecto/website/node_modules/parcel-bundler/src/Bundler.js:842:7)
    at async Command.bundle (/Users/hydra/Documents/GitHub/JS-projecto/website/node_modules/parcel-bundler/src/cli.js:241:20)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected]1.0.0 start: `parcel /index.html ejercicios/index.html ejercicios/**/*.html`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected]1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/hydra/.npm/_logs/2020-04-10T10_23_50_780Z-debug.log```

Me est谩 saliendo un errorcito en consola cada vez que se recarga el index.html dentro de typescript. 驴A alguien m谩s le pasa esto? La verdad el mensaje me resulta dif铆cil de entender.