Introducción

Apuntes de la clase:

Para todos aquellos que tienen el error ‘Uncaught 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 “browserslist” 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 “browserslist”. 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 ‘persona’ 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 ‘Compile 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(‘serviceWorker’ in navigator) {
navigator.serviceWorker.register(new URL(’/sw.js’, import.meta.url),
{type: ‘module’}).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é “ejercicios/index.html”, quedándome así:

“scripts”: {
“start”: “parcel 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 “npm 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?

“Uncaught 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: ‘Uncaught 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")

“browserslist”: [
“last 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:”parcel index.html ejercicios/index.html ejercicios//**/*.html
Si queremos que transpile para el navegador reciente agregamos la siguiente configuración en package.json
Browserslist:{“last 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 “cleanup” y “start” 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 ‘dist’, verificar el Storage Data en el inspector y actualizar con ctrl+shift+r; o sea, hacer una “limpieza” 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 “averiguar” por qué no funcionaba. Recuerden “si 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 ‘classPropierties’ isn’t 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:
“Uncaught (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 “text/html”. Strict MIME type checking is enforced for module scripts per HTML spec.
¿Alguien sabe como puedo solucionarlo?

¡Ayuda! tengo este error al ejecutar “npm 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 {“os”:“darwin”,“arch”:“any”} (current: {“os”:“linux”,“arch”:“x64”})

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.