大口不工作

Question

我正在尝试运行在jekkyl模板上发现的以下gulp。 我在Windows 8.1的节点4上运行，我不明白为什么每次我得到以下信息：

events.js:141
      throw er; //Unhandled 'error' event
      ^

我的印象是与Windows有关，因为当我在linux上运行时，我没有遇到任何问题。

这是大口吃：

gulp.task('jekyll-build', function (done) {
    browserSync.notify(messages.jekyllBuild);
    return cp.spawn('jekyll', ['build'], {stdio: 'inherit'})
        .on('close', done);
});

gulp.task('jekyll-rebuild', ['jekyll-build'], function () {
    browserSync.reload();
});

gulp.task('browser-sync', ['jekyll-build'], function() {
    browserSync({
        server: {
            baseDir: '_site'
        }
    });
});

gulp.task('stylus', function(){
        gulp.src('src/styl/main.styl')
        .pipe(plumber())
        .pipe(stylus({
            use:[koutoSwiss(), prefixer(), jeet(),rupture()],
            compress: true
        }))
        .pipe(gulp.dest('_site/assets/css/'))
        .pipe(browserSync.reload({stream:true}))
        .pipe(gulp.dest('assets/css'))
});

gulp.task('js', function(){
    return gulp.src('src/js/**/*.js')
        .pipe(plumber())
        .pipe(concat('main.js'))
        .pipe(uglify())
        .pipe(gulp.dest('assets/js/'))
});

gulp.task('imagemin', function() {
    return gulp.src('src/img/**/*.{jpg,png,gif}')
        .pipe(plumber())
        .pipe(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true }))
        .pipe(gulp.dest('assets/img/'));
});

gulp.task('watch', function () {
    gulp.watch('src/styl/**/*.styl', ['stylus']);
    gulp.watch('src/js/**/*.js', ['js']);
    gulp.watch('src/img/**/*.{jpg,png,gif}', ['imagemin']);
    gulp.watch(['*.html', '_includes/*.html', '_layouts/*.html', '_posts/*'], ['jekyll-rebuild']);
});

gulp.task('default', ['js', 'stylus', 'browser-sync', 'watch']);

有人知道为什么吗，可以帮助我理解吗？

Answer 1

基本上，主要问题在于以下几行：

gulp.task('default', ['js', 'stylus', 'browser-sync', 'watch']);

阵列中的任务同时发生。 如果脚本和样式通常可以同时处理，则browserSync几乎无法提供可能尚未创建的文件夹。 您必须重新构建过程才能在此处添加一些同步。

我还看到另一个问题：

// stylus task
.pipe(gulp.dest('_site/assets/css/'))
.pipe(browserSync.reload({stream:true}))
.pipe(gulp.dest('assets/css'))

要么

.pipe(gulp.dest('assets/js/'))

要么

.pipe(gulp.dest('assets/img/'));

您提供_site文件夹，但有时将复制到_site/assets/ ，有时复制到_site/assets/ assets/ 。 另外，您应该删除stylus任务中的最后一个gulp.dest 。

Answer 2

很高兴您尝试提供帮助。 我很幸运地发现问题是Windows运行脚本的方式。 我刚刚添加了一个“ .bat”，如下所示：

gulp.task('jekyll-build', function (done) {
    browserSync.notify(messages.jekyllBuild);
    return cp.spawn('jekyll.bat', ['build'], {stdio: 'inherit'})
        .on('close', done);
});