R
R
Rufix2020-02-26 15:22:57
JavaScript
Rufix, 2020-02-26 15:22:57

Buffered * events. What is the gulp script error?

I wrote a kind of small galp script and ran into a problem, the solution of which I did not find on the Internet.
The bottom line is that it works very strangely. I change the .scss file, the changes were accepted with automatic page refresh, they wanted to - they left somewhere.
Conditionally, I add position: absolute, save - nothing. Comment out this line -> save -> uncomment - voila, the changes have been added. The following is written in the console at this time:

[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)

The script itself:
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)

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question