Wprowadzenie do Gulp 4

Gulp to narzędzie do automatyzacji często pojawiających się podczas tworzenia strony internetowej zadań: minimalizacja plików CSS i JavaScript, łączenie wielu plików w jeden, konwersja LESS i SASS na CSS, konwersja języka TypeScript na JavaScript i tym podobnych zadań.

Zasada jego działania jest następująca: dla systemu Gulp pisane są zadania, a Gulp wykonuje te zadania w określonej kolejności.

Zainstalujmy Gulpa. W tym celu w wierszu poleceń należy wykonać polecenie:

npm install --global gulp-cli

Teraz utwórzmy projekt, w którym będzie używany Gulp. W tym celu w folderze projektu utwórzmy następującą strukturę plików:

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

Również do folderu projektu należy dodać package.json, Po tym można zainstalować Gulpa w projekcie. W tym celu w wierszu poleceń, będąc w folderze z projektem, należy wykonać następujące polecenie:

npm install --save-dev gulp

Utwórz projekt i zainstaluj w nim Gulpa.