Johdatus Gulp 4:ään

Gulp on työkalu web-sivuston kehityksen aikana usein esiintyvien tehtävien automatisointiin: CSS- ja JavaScript-tiedostojen minimointi, useiden tiedostojen yhdistäminen yhdeksi tiedostoksi, LESS- ja SASS-muotojen muuntaminen CSS:ksi, TypeScript-kielen muuntaminen JavaScriptiksi ja vastaavia tehtäviä.

Sen toimintaperiaate on seuraava: Gulp-järjestelmälle kirjoitetaan tehtäviä, ja Gulp suorittaa nämä tehtävät määritetyssä järjestyksessä.

Asennetaan Gulp. Tätä varten komentorivillä on suoritettava komento:

npm install --global gulp-cli

Luodaan nyt projekti, jossa käytetään Gulpia. Tätä varten luomme projektikansioon seuraavan tiedostorakenteen:

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

Myös projektikansioon on lisättävä package.json, Tämän jälkeen Gulp voidaan asentaa projektiin. Tätä varten komentorivillä, ollessa projektikansiossa, on suoritettava seuraava komento:

npm install --save-dev gulp

Luo projekti ja asenna siihen Gulp.