8

我正在尝试为 sass/js 编译创建 Gulp 任务，并且我还包含了用于实时重新加载的代码。它工作正常，只是有时 gulp.src 在我编辑它们时会将空文件扔到管道中。

var gulp = require('gulp');

var sass = require('gulp-sass'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify'),
    rename = require('gulp-rename'),
    clean = require('gulp-clean'),
    debug = require('gulp-debug'),
    livereload = require('gulp-livereload'),
    lr = require('tiny-lr'),
    server = lr(),
    spawn = require('child_process').spawn,
    node;


gulp.task('server', function() {
    if (node) node.kill();

    node = spawn('node', ['./index.js'], {stdio: 'inherit'});

    node.on('close', function (code) {
        if (code === 8) {
            gulp.log('Error detected, waiting for changes...');
        }
    });
});


gulp.task('html', function() {
    return gulp.src('./src/*.html')
        .pipe(gulp.dest('./build'))
        .pipe(livereload(server));
});


gulp.task('js', function() {
    return gulp.src(['./src/js/*.js'], { base: './' })

保存文件时，调试会检查gulp.src输出，并且大多数情况下它会显示具有正确内容的文件，但有时这些文件是空的。

        .pipe(debug())
        .pipe(concat("all.min.js"))
        .pipe(uglify())
        .pipe(gulp.dest('./build/js'))
        .pipe(livereload(server));
});


gulp.task('scss', function() {
    return gulp.src('./src/scss/*.scss')
        .pipe(sass())
        .pipe(concat("all.css"))
        .pipe(gulp.dest('./build/css/'))
        .pipe(livereload(server));
});


gulp.task('listen', function(next) {
    server.listen(35729, function(err) {
        if (err) return console.error(err);
        next();
    });
});


gulp.task('clean', function(){
    return gulp.src(['./build/*'], {read:false})
        .pipe(clean());
});


gulp.task('watch', function() {
    gulp.watch('./src/*.html', ['html']);
    gulp.watch('./src/scss/*.scss', ['scss']);
    gulp.watch('./src/js/*.js', ['js']);
    gulp.watch('./index.js', ['server']);
});


gulp.task('default', ['clean', 'html', 'scss', 'js', 'listen', 'server', 'watch'], function () {

});

我不知道如何解决这个问题。当我运行 gulp 时，它最初总是可以工作，但后来当gulp.watch看到更改时出现问题。

当我在 Sublime Text 中使用 sftp 包保存文件时，看起来文件最终是空的。这很奇怪，因为使用 Vim 远程保存总是很有效。

4

1 回答 1

17

我不确定这是否可行，但似乎 Sublime 中的 SFTP 需要更多时间来更新服务器上的文件。Gulp.watch 即使文件未准备好也会触发 gulp 任务。将 setTimeout() 添加到 gulp.watch 进程后，我现在每次保存时它都在工作。

gulp.watch('./src/js/*.js', function() {
        setTimeout(function () {
            gulp.start('js');
        }, 300);
    });
于 2014-02-28T16:16:08.383 回答