Pasar al contenido principal
Alexys Lozada
José Luján
Manuel Rodriguez
José Luján
Luis Avilés
Álvaro Felipe
José Luján
Beto Quiroga
Jonathan MirCha
Jonathan MirCha
Álvaro Felipe
Alexys Lozada, Álvaro Felipe, Jonathan MirCha
Beto Quiroga
Alexys Lozada
Alexys Lozada
José Luján
Álvaro Felipe
Álvaro Felipe
Jonathan MirCha
Jonathan MirCha
Alexys Lozada, José Luján
Alexys Lozada, José Luján
Alexys Lozada, José Luján
Camilo Adobe
Álvaro Felipe
José Luján
Jonathan MirCha
Álvaro Felipe
Álvaro Felipe
Beto Quiroga, Alexys Lozada
Álvaro Felipe
Juan Villalvazo
Luis Avilés
Jonathan MirCha
Jonathan MirCha
Jonathan MirCha

Babel

Babel

Babel, es un compilador de JavaScript, que nos permite usar el JavaScript del futuro, HOY, es decir todas las especificaciones que se han dado desde 2015 (ES6, ES7, ES8, etc.) y que poco a poco los navegadores van implementando en su ruta de desarrollo. Lo que hace es convertir nuestro código moderno en una versión estándar (ES5.1) que todos los navegadores puedan interpretar, y listo, eso es lo que hace Babel, no hay más que decir.

Babel nos permite soportar todas estas características que en artículos posteriores iré explicando:

Instalación

Debes tener instalado previamente Node.js en tu equipo y en la carpeta de tu proyecto, debes instalar vía npm los siguientes paquetes:

$ npm install --save-dev babel-cli babel-core babel-preset-env

Si no sabes nada sobre la instalación de paquetes con Node.js y NPM te invito a que leas este artículo donde te lo explico ;).

Después a la instalación de estos paquetes, deberás crear un archivo de configuración en la carpeta de tu proyecto que se llame .babelrc con el siguiente código:

{
  "presets": ["env"]
}

Posteriormente, si usas algún gestor de tareas o empaquetador como gulp o webpack ya nada más requieres programar una tarea que compile babel en dichas herramientas.

Si no usas ninguna de estás herramientas, entonces define el siguiente comando en tu archivo package.json de tu proyecto:

"babel": "babel src --watch --out-dir public"

Donde:

  • 'src' será la carpeta de origen con los archivos js con sintaxis moderna y
  • 'public' será la carpeta donde se compilarán los archivos js con sintaxis estándar para todos los navegadores.

De tal manera que tu archivo package.json debería quedarte más o menos así:

{
  "name": "configurando-babel",
  "version": "1.0.0",
  "description": "Aprendiendo a configurar Babel",
  "scripts": {
    "babel": "babel src --watch --out-dir public"
  },
  "author": "Jonathan MirCha <jonmircha@gmail.com>",
  "license": "MIT",
  "devDependencies": {
    "babel-cli": "^6.24.1",
    "babel-core": "^6.25.0",
    "babel-preset-env": "^1.6.0"
  }
}

Finalmente lo único que tienes que hacer es ejecutar en la terminal el comando babel y listo:

$ npm run babel

De cualquier manera no esta de más que siempre revises la documentación en el sitio oficial ;).

Recuerda que en EDteam tenemos varios cursos que te introducen y especializan en este maravilloso lenguaje:

En el siguiente capítulo te hablare de las variables de bloque y las constantes.

Artículos anteriores de la serie 'El estándar actual de JavaScript':

  1. ECMAScript el estándar de JavaScript

Se despide su amigo y docente digital Jonathan MirCha, sean felices, hasta siempre, nos leemos la próxima semana... 

...bye ;)

Suscríbete al blog de EDteam

Ingresa tu correo electrónico para recibir nuestro boletín semanal