Почему live reload не работает с gulp-connect?

я использую gulp-connect такой:

gulp.task('watch', function() {
  gulp.watch(paths.scss, ['scss']);

  gulp.watch(distPaths, function() {
    return gulp.src(distPaths)
               .pipe(connect.reload());
  });
});

бит live reload работает нормально.

мой вопрос в том, почему следующее не работает:

gulp.task('watch', function() {
  gulp.watch(paths.scss, ['scss']);
  gulp.watch(distPaths, connect.reload);
});

какого gulp.src(distPaths) понравится?

кроме того, в чем важность return?

14
gulp livereload

3 ответов

  1. connect.reload() необходимо использовать в поток. В вашем примере вы пытаетесь вызвать его как автономную функцию, которая ничего не делает. Зову connect.reload() возвращает обработчик потока, который принимает входные данные и что-то с ним делает. Это фактически no-op во втором примере.

  2. вам нужно return или задачи выполняются синхронно. (Вы также можете вернуть обещание или использовать обратный вызов функция.)

    в принципе, если вы не предоставляете какой-либо способ для gulp отслеживать ход выполнения асинхронных задач, он должен предположить, что они завершены, когда вы возвращаетесь из функции. Если ты ... --3--> труба, она может слушать для ее для достижения конца.

кроме того, это может работать лучше использовать gulp-watch для ваших часов, потому что он проходит только через измененные файлы, что вы хотите для live reload:

var watch = require('gulp-watch');

gulp.task('watch', function() {
    gulp.watch(paths.scss, ['scss']);
    watch(distPath).pipe(connect.reload());
});
21

мне также потребовалось некоторое время, чтобы выяснить, как я подключаю функцию перезагрузки с моей настройкой. Моя задача watch включает в себя несколько папок, так как я не всегда запускаю полную задачу сборки во время разработки. Некоторые файлы загружаются из .папка tmp, основанная на Yeoman gulp-генератор webapp. Я не уверен, что это самый быстрый способ, но я решил его так:

 gulp.watch([
    '.tmp/*.html',
    '.tmp/styles/**/*.css',
    'app/js/**/*.js',
    'app/images/**/*'
]).on('change', function (file) {
    gulp.src( file.path)
        .pipe( $.connect.reload() );
});

надеюсь, что это поможет кому-то.

3

Я не совсем понимаю, почему (@overzealous делает хорошие моменты), но я обнаружил, что мои меньшие файлы постоянно обновляются "версия позади", аналогичная этой проблеме, опубликованной в generator-gulp-webapp:Livereload, похоже, экономит на изменениях загрузки #77

с версия 0.3.0 генератор-gulp-webapp использует browsersync вместо подключения / livereload и обновления моего gulpfile в соответствии решили все мои проблемы!

HTH

2