Introducción a Gulp 4

Gulp es una herramienta para automatizar tareas que surgen frecuentemente durante el desarrollo de sitios web: minimización de archivos CSS y JavaScript, fusión de varios archivos en uno, transformación de LESS y SASS a CSS, conversión del lenguaje TypeScript a JavaScript y tareas similares.

Su principio de funcionamiento es el siguiente: para el sistema Gulp se escriben tareas, y Gulp ejecuta estas tareas en la secuencia especificada.

Instalemos Gulp. Para ello, en la línea de comandos debemos ejecutar el comando:

npm install --global gulp-cli

Ahora creemos un proyecto en el que se utilizará Gulp. Para ello, en la carpeta del proyecto crearemos la siguiente estructura de archivos:

/src/
- /js/
  - script1.js
  - script2.js
  - script3.js
- /css/
  - styles1.css
  - styles2.css
- /img/
  - image1.png
  - image2.png
  - image3.png
- index.html

También debemos agregar package.json a la carpeta del proyecto. Después de esto, podemos instalar Gulp en el proyecto. Para ello, en la línea de comandos, ubicados en la carpeta del proyecto, es necesario ejecutar el siguiente comando:

npm install --save-dev gulp

Cree un proyecto e instale Gulp en él.