Gulp.js - это инструмент для автоматизации задач веб-разработки. Он позволяет создавать и запускать задачи, которые помогают вам сборке, минификации, оптимизации и тестировании вашего веб-приложения.
Для настройки Gulp и указания, что забирать и куда и как отдавать, необходимо создать файл, называемый Gulpfile.js, в корневой папке вашего проекта. В этом файле вы будете описывать задачи, которые Gulp должен выполнить.
Первым шагом в настройке Gulp является установка самого Gulp и его плагинов, которые вы собираетесь использовать. Вы можете установить Gulp и плагины с помощью менеджера пакетов npm, запустив следующую команду в командной строке:
npm install gulp gulp-plugin1 gulp-plugin2 --save-dev
где gulp - это сам Gulp, gulp-plugin1 и gulp-plugin2 - это плагины, которые вы хотите использовать для своих задач. Флаг --save-dev говорит npm, что эти пакеты должны быть установлены как зависимости разработки в вашем проекте.
После установки Gulp и плагинов вы можете приступить к описанию задач в Gulpfile.js. Каждая задача представляет собой функцию JavaScript, определенную с использованием синтаксиса Gulp.
Примерно так может выглядеть файл Gulpfile.js:
const gulp = require('gulp');
const plugin1 = require('gulp-plugin1');
const plugin2 = require('gulp-plugin2');
gulp.task('task1', () => {
return gulp.src('source/path')
.pipe(plugin1())
.pipe(plugin2())
.pipe(gulp.dest('destination/path'));
});
gulp.task('task2', () => {
return gulp.src('source/path2')
.pipe(plugin1())
.pipe(plugin2())
.pipe(gulp.dest('destination/path2'));
});
gulp.task('default', gulp.series('task1', 'task2'));
В этом примере мы создали две задачи - task1 и task2. Каждая задача берет файлы из указанного исходного пути (source/path или source/path2), пропускает их через плагины plugin1 и plugin2 и сохраняет результат в указанное место (destination/path или destination/path2).
Задача default является встроенной задачей Gulp, которая запускается при вводе команды gulp в командной строке. В данном случае, она запускает последовательно задачи task1 и task2.
Далее, после создания Gulpfile.js и описания задач, вы можете выполнить эти задачи, запустив Gulp из командной строки. Для выполнения задачи task1 введите следующую команду:
gulp task1
Gulp выполнит все указанные в задаче действия и вы увидите результат работы.
В общем, настройка Gulp позволяет вам указать, какие файлы вам нужно взять (с помощью gulp.src), на какие действия их нужно подвергнуть (с использованием плагинов) и куда сохранить результат (с помощью gulp.dest). Gulpfile.js - это файл, в котором вы описываете ваши задачи и их последовательность, а Gulp - инструмент, который выполняет эти задачи.