Полный цикл в digital

Стандартный мониторинг изменений файлов Gulp

Мониторинг изменений в файлах, очень удобно применять в работе, отпадает необходимость вручную запускать определенную задачу каждый раз, когда нужно зафиксировать внесенные изменения.

Рассмотрим возможность запуска автоматического мониторинга в Gulp с помощью встроенной функции. Допустим, у нас имеется именованная задача buildStyles:

function buildStyles() {
return gulp.src('./scss/*.scss')
    .pipe(debug())
    .pipe(sass.sync().on('error', sass.logError))
    .pipe(gulp.dest('./'));
};
exports.buildStyles = buildStyles;

Нам нужно сделать так, чтобы Gulp запускал задачу каждый раз самостоятельно, когда вносятся изменения в любой из scss-файлов. Для этого создадим еще одну именованную задачу, основная цель которой - отслеживание изменений в указанных файлах:

gulp.task("watch", () => {
    // в качестве аргументов передаем два параметра, первый параметр (что и где Gulp должен отслеживать), второй параметр (что должен делать Gulp, если обнаружит изменения в указанном месте)
    gulp.watch("scss/*.scss", gulp.series("buildStyles"));
});

Готовый gulpfile.js

gulpfile.js'use strict';
// gulp
const gulp = require("gulp");
// преобразоваваем scss в css
const sass = require('gulp-sass')(require('sass'));
// дебагер, будет сообщать какие файлы затронуло
const debug = require('gulp-debug');
// задача
function buildStyles() {
return gulp.src('./scss/*.scss')
    .pipe(debug())
    .pipe(sass.sync().on('error', sass.logError))
    .pipe(gulp.dest('./'))
};
// экспорт задачи
exports.buildStyles = buildStyles;
// задача на отслеживание файлов
gulp.task("watch", () => {
    // наблюдаем за стилями
    gulp.watch("scss/*.scss", gulp.series("buildStyles"));
});
Заполните форму уже сегодня!
Для начала сотрудничества необходимо заполнить заявку или заказать обратный звонок. В ответ получите коммерческое предложение, которое будет содержать индивидуальную стратегию с учетом требований и поставленных задач
Работаем по будням с 9:00 до 18:00. Заявки, отправленные в выходные, обрабатываем в первый рабочий день до 12:00.
Спасибо, ваш запрос принят и будет обработан!
Эйч Маркетинг