Parcel es un empaquetador de archivos.
Una aplicación estará formada por decenas de ficheros html, js, ts, etc.
Cuando queramos distribuir la aplicación Parcel nos simplificará la función. Si queremos probar nuestra aplicación desplegando en un servidor Web veréis que es sencillo e inmediato.
Antes de comenzar recordarte que este tutorial forma parte de una cadena de tutoriales en las que pretendo simplemente probar tecnologías actuales, aquí abajo podrás encontrarlos:
- Primero pasos con TypeScript con Microsoft Visual Studio Code
- Integración de GitHub / Git / GibHub Desktop y MS Visual Studio Code
- Instalación de Jest con TypeScript y MS Visual Studio Code
- Instalación de Prettier en MS Visual Studio Code
También me gustaría que vieras este video de 2 minutos para entender dónde estamos y a dónde vamos.
En lo que pretendo estar entretenido las próximas semanas para jugar con #TypeScript. Recomendaciones de @cesalberca Me ha dicho que, cuando haya cacharreado, en un rato lo montamos todo 😭😭 pic.twitter.com/gdfBRFMQiT
— Roberto Canales Mora (@rcanalesmora) January 8, 2020
Mi equipo es Mac
macOS Catalina
Versión 10.15.2
MacBook Pro (15-inch, 2018)
Procesador 2,9 GHz Intel Core i9 de 6 núcleos
Memoria 32 GB 2400 MHz DDR4
Gráficos Intel UHD Graphics 630 1536 MB
Lo primero que vamos a hacer es ir a la documentación (escueta) e instalar Parcel
https://parceljs.org/getting_started.html
La instalación se realiza con el comando: npm install -g parcel-bundler
Ojo que sin sudo fallará la instalación.
Ya con los permisos me sigue dando algún error (tengo que investigar un poco más) pero luego funciona lo que os quiero mostrar.
Ahora vamos a generar un fichero package.json adecuado. Usamos el comando npm init -y
Inicialmente es lo que teníamos.
{
"test": "jest",
"devDependencies": {
"prettier": "^1.19.1"
}
}
Después este es el resultado.
Ahora creamos un fichero índex.html y un índex.js
Con parcel build ./src/index.html empaqueta y arranca un servidor en el puesto 1234 donde probar nuestro proyecto
Podemos ver en un navegador el resultado.
Podemos ver los ficheros generado y hacemos commit.
Ahora cambiamos el fichero a índex.ts. No hay que hacer nada adicional.
Y sin hacer nada más que grabar, podemos comprobar el resultado.
Con la opción built se crea una carpeta de distribución.
A mí desde luego me ha parecido sencillisimo crear un servidor donde probar nuestro proyecto con Parcel.
Todavía nos quedan cosas para gobernar el ciclo de vida de desarrollo.
Ahora el siguiente podría ser estudiar el modelo MVC para ir creando una estructura JavaScript.
Aquí te dejo el enlace al siguiente tutorial:
