Gulp src返回空文件 [英] Gulp src returns empty file

问题描述

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

  var gulp = require（'吞'）; 
 $ b var sass = require（'gulp-sass'），
 concat = require（'gulp-concat'），
 uglify = require（'gulp-uglify'）， 
 rename = require（'gulp -remove'），
 clean = require（'gulp-clean'），
 debug = require（'gulp-debug'），
 livereload = require（'gulp-livereload'），
 lr = require（'tiny-lr'），
 server = lr（），$ b $ spawn = require（'child_process'）。spawn， 
节点; 
 
 $ b gulp.task（'server'，function（）{
 if（node）node.kill（）; 
 
 node = spawn（ 'node'，['./index.js']，{stdio：'inherit'}）; 
 
 node.on（'close'，function（code）{
 if代码=== 8）{
 gulp.log（'检测到错误，正在等待更改...'）; 
} 
}）; 
}）; 
 
 $ b $ gulp.task（'html'，function（）{
 return gulp.src（'./ src / *。html'）
 .pipe gulp.dest（'./ build'））
.pipe（livereload（server））; 
}）; 
 
 $ b $ gulp.task（'js'，function（）{
 return gulp.src（['./ src / js / *。js']，{base： './'}）
  

当保存文件时，debug将检查 gulp .src 输出，并且大多数情况下它显示的文件具有适当的内容，但是这些文件不时是空的。

  .pipe（debug（））
 .pipe（concat（all.min.js））
 .pipe（uglify（））
 .pipe（gulp。 dest（'./ build / js'））
.pipe（livereload（server））; 
}）; 
 
 $ b gulp.task（'scss'，function（）{
 return gulp.src（'./ src / scss / *。scss'）
。 pipe（sass（））
 .pipe（concat（all.css））
 .pipe（gulp.dest（'./ build / css /'））
 .pipe livereload（服务器））; 
}）; 
 
 
 gulp.task（'listen'，function（next）{
 server.listen（35729，function（err）{
 if（err）return console .error（err）; 
 next（）; 
}）; 
}）; 
 
 $ b $ gulp.task（'clean'，function（）{
 return gulp.src（['./ build / *']，{read：false}）
 .pipe（clean（））; 
}）; 
 
 $ b 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']）; 
}）; 
 
 $ b $ gulp.task（'default'，['clean'，'html'，'scss'，'js'，'listen'，'server'，'watch']，函数（）{
 
}）; 
  

我不知道如何解决这个问题。当我运行gulp的时候它总是起作用，但后来当 gulp.watch 看到更改时，问题就出现了。

当我在Sublime Text中使用sftp包保存它们时，类文件最终变为空白。它非常奇怪，因为用Vim远程保存总是很好。

看来Sublime中的SFTP需要更多时间来更新服务器上的文件。即使文件没有准备好，Gulp.watch也会触发吞咽任务。在将setTimeout（）添加到gulp.watch过程中之后，每当我现在保存时，它都在工作。

  gulp.watch（'。 /src/js/*.js'，function（）{
 setTimeout（function（）{
 gulp.start（'js'）; 
}，300）; 
 }）; 
  

I'm trying to create Gulp task for sass/js compilation and I've also included code for live reload. It works fine except that sometimes gulp.src throws empty files into the pipe when I edit them.

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: './' })

When files are saved debug is checking the gulp.src output and most of the time it shows files with proper content but from time to time those files are empty.

        .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 () {

});

I'm not sure how to fix that. When I run gulp it always works initially but later when gulp.watch sees changes the problem appears.

It looks like files end up being empty when I save them using sftp package in Sublime Text. Its very strange because saving with Vim remotely always works well.

解决方案

I'm not sure if is is the way to go but it seems that SFTP in Sublime needs more time to update file on the server. Gulp.watch triggers the gulp task even when the file is not ready. After adding the setTimeout() to gulp.watch process it is working every time i save now.

gulp.watch('./src/js/*.js', function() {
        setTimeout(function () {
            gulp.start('js');
        }, 300);
    });

这篇关于Gulp src返回空文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！