Question

This question暗示我如何与Gulp一起运行Jekyll。

它工作正常，除了我无法触发livereload（但它运行没有错误）。

我对Node的了解有限，所以我可能错过了一些东西......

var gulp = require('gulp');
var refresh = require('gulp-livereload');
var lr = require('tiny-lr');
var server = lr();

gulp.task('jw', function(){
    var spawn = require('child_process').spawn,
        j     = spawn('jekyll', ['-w', 'build']);

    j.stdout.on('data', function (data) {
        console.log('stdout: ' + data); // works fine
        refresh(server); // doesn’t trigger
    });
});

Answer 1

gulp-livereload要求通过gulp.src()或其他vinyl输入源将文件传输到其中。在这种情况下，我建议adding gulp-watch注意Jekyll写的文件，并根据它重新加载。

它看起来像这样：

var gulp = require('gulp');
var refresh = require('gulp-livereload');
var watch = require('gulp-watch');
var lr = require('tiny-lr');
var server = lr();

gulp.task('jw', function(){
    var spawn = require('child_process').spawn,
        j     = spawn('jekyll', ['-w', 'build']);

    j.stdout.on('data', function (data) {
        console.log('stdout: ' + data); // works fine
    });

    watch({glob: '/glob/path/to/jekyll/output'}, function(files) {
        // update files in batch mode
        return files.pipe(refresh(server));
    });
});

只要Jekyll只重写已更改的文件，这将完全。但是，如果它覆盖了所有内容，那么livereload只会在每次更改时刷新浏览器。

Answer 2

您可以在构建结束时触发livereload，使其重新加载页面，这样您就不会有多次刷新：

使用Jekyll与Gulp和Livereload

2 个答案: