Introduktion til Gulp 4

Gulp er et værktøj til automatisering af hyppigt forekommende opgaver under udvikling af en hjemmeside: minimering af CSS- og JavaScript-filer, sammenlægning af flere filer til én, omdannelse af LESS og SASS til CSS, omdannelse af sproget TypeScript til JavaScript og lignende opgaver.

Det fungerer på følgende måde: til Gulp-systemet skrives opgaver, og Gulp udfører disse opgaver i den angivne rækkefølge.

Lad os installere Gulp. For at gøre dette skal du i kommandolinjen udføre kommandoen:

npm install --global gulp-cli

Lad os nu oprette et projekt, hvor Gulp vil blive brugt. For at gøre dette skal vi i projektmappen oprette følgende filstruktur:

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

Derudover skal package.json tilføjes til projektmappen. Herefter kan Gulp installeres i projektet. For at gøre dette skal du i kommandolinjen, mens du befinder dig i projektmappen, udføre følgende kommando:

npm install --save-dev gulp

Opret et projekt og installer Gulp i det.