爲什麼不使用gulp-connect重新加載工作？

Question

我用gulp-connect這樣的：

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

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

活重載位工作正常。

我的問題是，爲什麼下面不工作：

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

什麼gulp.src(distPaths)位是？

另外，return的重要性是什麼？

Answer 1

1. connect.reload()需要在流使用。在你的例子中，你試圖把它稱爲獨立函數，它什麼都不做。調用connect.reload()會返回一個流處理程序，它接受輸入並對其執行任何操作。在第二個例子中，它實際上是一個無操作。

2. 您需要return或tasks are run synchronously。 （您也可以返回一個承諾或使用回調函數。）

   基本上，如果您沒有提供某種方式讓吞噬者跟蹤異步任務的進度，那麼它必須假設他們在從功能。如果您使用的是管道，它可以聽到它達到最後。

而且，它可能工作更好地使用gulp-watch爲您的手錶，因爲它只能通過修改過的文件，這是你想要的生活重裝：

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

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

Answer 2

我花了也有同時找出我如何連接重新加載功能與我的設置。 我的手錶任務包含多個文件夾，因爲在開發過程中，我並不總是執行完整的構建任務。根據Yeoman gulp-webapp generator，某些文件從.tmp文件夾加載。我不確定這是否是最快的方式，但我解決它是這樣的：

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

希望能幫助別人。

Answer 3

我不完全理解爲什麼（@overzealous使好點），但我發現我少的文件正在持續刷新「後面的版本」，類似這樣的問題發佈到發電機一口-web應用：Livereload seems to be a save behind on loading changes #77

由於version 0.3.0 generator-gulp-webapp使用browsersync而不是連接/ livereload，並更新我的gulp文件以匹配解決我所有的問題！

HTH