@Rufix

Buffered * events. В чем ошибка скрипта Gulp?

Написал вроде небольшой галп скрипт и столкнулся с проблемой, решение которой не нашел в интернете.
Суть в том, что он очень странно работает. Изменяю .scss файл, изменения захотели принялись с автоматическим обновлением страницы, захотели - ушли куда-то.
Условно, добавляю position: absolute, сохраняю - ничего. Закомментирую эту строчку -> сохраню -> раскомментирую - вуаля, изменения добавились. В консоли в этом время пишется следующее:
[Browsersync] Reloading Browsers... (buffered 4 events)
[14:17:05] Starting 'style'...
[14:17:05] Starting 'style'...
[Browsersync] 1 file changed (style.css)
[14:17:05] Finished 'style' after 39 ms
[14:17:05] Starting '<anonymous>'...
[Browsersync] 1 file changed (style.css)
[14:17:05] Finished 'style' after 40 ms
[14:17:05] Starting '<anonymous>'...
[Browsersync] 1 file changed (css)
[14:17:05] Finished '<anonymous>' after 3.92 ms
[Browsersync] 1 file changed (css)
[14:17:05] Finished '<anonymous>' after 2.72 ms
[Browsersync] Reloading Browsers... (buffered 4 events)

Сам скрипт:
const gulp = require('gulp'),
       sass = require('gulp-sass'),
       server = require('browser-sync').create(),
       pug = require('gulp-pug'),
       pugLinter = require('gulp-pug-linter'),
       htmlValidator = require('gulp-w3c-html-validator'),
       autoprefixer = require('gulp-autoprefixer'),
       shorthand = require('gulp-shorthand'),
       cleanCSS = require('gulp-clean-css'),
       sourcemaps = require('gulp-sourcemaps'),
       imagemin = require('gulp-imagemin'),
       plumber = require('gulp-plumber')

function pug2html() {
  return gulp.src('src/pages/*.pug')
    .pipe(sourcemaps.init())
    .pipe(plumber())
    .pipe(pugLinter({ reporter: 'default' }))
    .pipe(pug())
    .pipe(htmlValidator())
    .pipe(gulp.dest('build'))
}

function style() {
  return gulp.src('./src/scss/**/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(autoprefixer({
      cascade: false
    }))
    .pipe(shorthand())
    .pipe(cleanCSS({
      compatibility: 'ie8'
    }))
    .pipe(gulp.dest('./build/css'))
    .pipe(server.stream());
}

function minifyImg() {
  return gulp.src('./src/img/**/*')
    .pipe(imagemin())
    .pipe(gulp.dest('build/img'))
}

function serve(cb) {
  server.init({
    server: 'build',
    notify: false,
    open: true,
    cors: true
  })

  gulp.watch('src/img/**/*.{gif,png,jpg,jpeg,svg,webp}', gulp.series(minifyImg)).on('change', server.reload)
  gulp.watch('src/scss/**/*.scss', gulp.series(style, cb => gulp.src('build/css').pipe(server.stream().on('end', cb))))
  gulp.watch('src/scss/**/*.scss', gulp.series(style, cb => 
    gulp.src('build/css').pipe(server.stream()).on('end', cb)))
  gulp.watch('src/pages/**/*.pug', gulp.series(pug2html))
  gulp.watch('build/*.html').on('change', server.reload)

  return cb()
}

module.exports.start = gulp.series(style, minifyImg,pug2html, serve)
  • Вопрос задан
  • 112 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы