Почему Gulp watch постоянно обрабатывает файлы?

Question

[drtvader]

Добрый день всем! При запуске gulp watch начинает постоянно обновлять файлы? Он же ведь должен только при сохранении файла обновиться и замолчать?

var gulp   = require('gulp'),
    watch  = require('gulp-watch')
    config = require('../../config');

/*
 * Смотрим за изменениями
 */

gulp.task('watch', function(){
    watch([config.watch.html], function(event, cb) {
        gulp.start('html');
    });
    watch([config.watch.less], function(event, cb) {
        gulp.start('less');
    });
    watch(config.watch.jsInternal, function(event, cb) {
        gulp.start('js-internal');
    });
    watch([config.watch.jsExternal], function(event, cb) {
        gulp.start('js-external');
    });
    watch([config.watch.images], function(event, cb) {
        gulp.start('images');
    });
    watch([config.watch.sprites], function(event, cb) {
        gulp.start('sprites');
    });
    watch([config.watch.fonts], function(event, cb) {
        gulp.start('fonts');
    });
});

Answer 1

[Дмитрий Кравченко]

Предположу, что вы сохраняете файлы в то же место, откуда берете

var src = '*/**';
gulp.src(src)
  .pipe(somePlugin)
  .pipe(gulp.dest(src));

выложите код gulpfile.js

Comments

[drtvader]

var requireDir = require('require-dir');

// Require all tasks in gulp/tasks, including subfolders
requireDir('./gulp/tasks', { recurse: true });

[Дмитрий Кравченко]

drtvader: ну а сами таски-то где?

[drtvader]

Дмитрий Кравченко: можете подробнее сказать? Не силен пока в терминологии. Нужны настройки в файлах из папки tasks?

Answer 2

[Arthur Gurinovich]

А не могли бы Вы опубликовать сам таск, чтобы точнее определить причину?

Comments

[drtvader]

опубликовал

Answer 3

[Сергей]

Покажи работу своих тасков, что ты вызываешь ('html', 'less' и т.п. ) Косяк кроется там.
Пример рабочего таска + watch

gulp.task('default', ['run-beats']);

gulp.task('run-beats', () => {
  gulp.start('clean-css');
  gulp.start('beats-watch-sass');
});

gulp.task('clean-css', () => {
  console.log('Чистим папку app/css/*');
  del(['app/css/**', '!app/css']);
});

gulp.task('beats-sass',  () => {
  console.log('Работы с css файлами в app/css/*');

  return gulp.src('./beats/styles/**/*.scss')           // Какие файлы выбрать
      .pipe(plumber({                                   // обработка ошибок
        errorHandler:  (error) => {
          console.log('Error: ' + error.message);
          this.emit('end');
        }
      }))
      .pipe(sass())                                     // Перевод файлов в sass
      .pipe(autoprefixer({                              // автопрефикс
        browsers: ['> 1%', 'last 10 versions', 'Firefox 5', 'Opera 12', 'ie 8', 'ie 9', 'ie 7']
      }))
      .pipe(gulp.dest('./app/css'))                     // Куда файлы вставить
});

gulp.task('beats-watch-sass', () => {
  console.log('Запускаем отслеживание изменений sass файлов ...');
  gulp.watch('./beats/styles/**/*.scss')
    .on('all', function (event, path) {
      if(event == 'unlink'){
        gulp.start('clean-css');
      }

      gulp.start('beats-sass');
    })
});

Comments

[drtvader]

less:
var gulp = require('gulp'),
sourcemaps = require('gulp-sourcemaps'),
browsersync = require('browser-sync'),
less = require('gulp-less'),
lessPluginAutoPrefix = require('less-plugin-autoprefix'),
lessPluginCleanCSS = require('less-plugin-clean-css'),
concat = require('gulp-concat'), //Gulp Concat - конкатинация (объединение) однородных файлов
csso = require('gulp-csso'),

config = require('../../config'),

autoprefixer = new lessPluginAutoPrefix(config.autoprefixer),
cleancss = new lessPluginCleanCSS({ advanced: true });

/*
* Конкатинация LESS для Desktop и Mobile
*/

//Конкатинация стилей для version
gulp.task('concat-desktop-big', function() {
browsersync.notify('Concat Desktop big Less');

return gulp.src(config.less.bemblocks + '*/*.desktop.big.less')
.pipe(concat('bem.desktop.big.less'))
.pipe(gulp.dest(config.less.concatless))
});
//Конкатинация стилей для version
gulp.task('concat-desktop', function() {
browsersync.notify('Concat Desktop Less');

return gulp.src(config.less.bemblocks + '*/*.desktop.less')
.pipe(concat('bem.desktop.less'))
.pipe(gulp.dest(config.less.concatless))
});

//Конкатинация стилей для version
gulp.task('concat-mobile', ['concat-desktop'], function() {
browsersync.notify('Concat Mobile Less');

return gulp.src(config.less.bemblocks + '*/*.mobile.less')
.pipe(concat('bem.mobile.less'))
.pipe(gulp.dest(config.less.concatless))
});

//Конкатинация стилей для version
gulp.task('concat-mobilemin', ['concat-mobile'], function() {
browsersync.notify('Concat Mobile Min Less');

return gulp.src(config.less.bemblocks + '*/*.mobile.min.less')
.pipe(concat('bem.mobile.min.less'))
.pipe(gulp.dest(config.less.concatless))
});

//Конкатинация стилей для version
gulp.task('concat-tablet', ['concat-mobilemin'], function() {
browsersync.notify('Concat Tablet Less');

return gulp.src(config.less.bemblocks + '*/*.tablet.less')
.pipe(concat('bem.tablet.less'))
.pipe(gulp.dest(config.less.concatless))
});

/*
* Компиляция LESS в CSS
* Build sourcemaps
*/

gulp.task('less', ['concat-tablet'], config.wrapPipe(function(success, error) {
browsersync.notify('Compiling Main Less');

return gulp.src(config.less.src)
.pipe(sourcemaps.init())
.pipe(less({
plugins: [autoprefixer],
}).on('error', error))
.pipe(sourcemaps.write())
// .pipe(csso()) //Нужно для конечного билда, пусть пока здесь будет
.pipe(gulp.dest(config.less.development.dest))
}));

[drtvader]

var gulp = require('gulp'),
browsersync = require('browser-sync'),
fileinclude = require('gulp-file-include'),
config = require('../../config');

/*
* Build html
*/

gulp.task('html', config.wrapPipe(function(success, error) {
browsersync.notify('Compiling html');

return gulp.src(config.html.src)
.pipe(fileinclude({
prefix: '@@',
basepath: '@file',
indent: true
}).on('error', error))
.pipe(gulp.dest(config.html.dest))
}));

[drtvader]

var gulp = require('gulp'),
browsersync = require('browser-sync'),
imagemin = require('gulp-imagemin'),
pngquant = require('imagemin-pngquant'),
config = require('../../config');

config.imagemin.use = [pngquant()];

/*
* Сжатие картинок
*/

gulp.task('images', ['sprites'], config.wrapPipe(function(success, error) {
browsersync.notify('Compiling images');

return gulp.src(config.images.src)
.pipe(imagemin(config.imagemin).on('error', error))
.pipe(gulp.dest(config.images.development.dest))
}));

[drtvader]

var gulp = require('gulp'),
browsersync = require('browser-sync'),
fileinclude = require('gulp-file-include'),
uglify = require('gulp-uglify'),
sourcemaps = require('gulp-sourcemaps'),
config = require('../../config');

/*
* Build js
*/

gulp.task('js', [
'js-internal',
'js-external'
]);

gulp.task('js-internal', config.wrapPipe(function(success, error) {
browsersync.notify('Compiling js');

return gulp.src(config.js.srcInternal)
.pipe(fileinclude({
prefix: '@@',
basepath: '@file',
indent: true
}).on('error', error))
.pipe(sourcemaps.init())
.pipe(uglify().on('error', error))
.pipe(sourcemaps.write())
.pipe(gulp.dest(config.js.development.dest))
}));

gulp.task('js-external', config.wrapPipe(function(success, error) {
browsersync.notify('Compiling js');

// jquery делаем отдельно чтобы подключить его в head
gulp.src(config.js.srcJquery)
.pipe(gulp.dest(config.js.development.destJquery));

// html5shiv делаем отдельно чтобы подключить его в head
gulp.src(config.js.srcHtml5shiv)
.pipe(gulp.dest(config.js.development.destHtml5shiv));

return gulp.src(config.js.srcExternal)
.pipe(fileinclude({
prefix: '@@',
basepath: '@file',
indent: true
}).on('error', error))
.pipe(gulp.dest(config.js.development.dest))
}));