Tại sao không tải lại công việc với gulp-connect?

Question

tôi sử dụng gulp-connect như thế này:

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

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

Các tải lại sống chút hoạt động tốt.

Câu hỏi của tôi là, tại sao sau không làm việc:

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

gì bit gulp.src(distPaths) là gì?

Ngoài ra, tầm quan trọng của return là gì?

Answer 1

1. connect.reload() cần phải được sử dụng trong một dòng. Trong ví dụ của bạn, bạn đang cố gắng gọi nó là một hàm độc lập, không có gì. Gọi số connect.reload() trả về trình xử lý luồng nhận dữ liệu nhập và thực hiện điều gì đó với nó. Nó có hiệu quả là một no-op trong ví dụ thứ hai.

2. Bạn cần return hoặc tasks are run synchronously. (Bạn cũng có thể trả lại lời hứa hoặc sử dụng chức năng gọi lại.)

   Về cơ bản, nếu bạn không cung cấp cách nào đó để theo dõi tiến trình của các tác vụ không đồng bộ, bạn phải giả sử chúng hoàn tất khi bạn trở về chức năng. Nếu bạn return đường ống, nó có thể nghe để nó đạt đến đích.

Ngoài ra, nó có thể làm việc tốt hơn để sử dụng gulp-watch cho đồng hồ của bạn, bởi vì nó chỉ đi qua các tập tin thay đổi, đó là những gì bạn muốn cho tải lại sống:

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

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

Answer 2

Nó đã cho tôi cũng là một trong khi tìm ra cách tôi kết nối chức năng tải lại với thiết lập của tôi. Nhiệm vụ đồng hồ của tôi bao gồm nhiều hơn một thư mục vì tôi không phải lúc nào cũng chạy một tác vụ xây dựng đầy đủ trong khi tôi đang phát triển. Một số tệp được tải từ thư mục .tmp, dựa trên Yeoman gulp-webapp generator. Tôi không chắc chắn đây có phải là cách nhanh nhất hay không nhưng tôi đã giải quyết nó như sau:

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

Hy vọng sẽ giúp người khác.

Answer 3

tôi không hoàn toàn hiểu được lý do tại sao (@overzealous làm cho điểm tốt), nhưng tôi thấy rằng các file ít của tôi đã được làm mới liên tục 'một phiên bản đằng sau', tương tự như vấn đề này được đưa lên máy phát điện-ngụm-webapp: Livereload seems to be a save behind on loading changes #77

Vì version 0.3.0 generator-gulp-webapp sử dụng browsersync thay vì kết nối/tải trước và cập nhật gulpfile của tôi để khớp với tất cả các vấn đề của tôi!

HTH