Jekyll自动重装客户端？

Question

这是一个关于Jekyll自动重新加载的问题,但它仅用于文件生成方面的"重新加载".

我还希望我的浏览器在更新Jekyll文件后自动刷新页面,就像例如Meteor(开箱即用)和DocPad(docpad install livereload).如何使用Jekyll进行实时重装？

Answer 1

介绍

我重用了旧的但有效的shakyShane/jekyll-gulp-sass-browser-sync代码.

由于Jekyll现在包含本机sass/scss处理,我只留下了在Gulp任务中使用browsersync所需的命令

Prerequisits

您需要安装Jekyll,Node 和Npm.

注意:这仅在Ubuntu 14.04上测试过.Apple和Windows用户可能需要调整此方法或者不是,欢迎提供建设性的反馈.

杰奇

此浏览器同步安装可以在现有的Jekyll源上进行.

您也可以从新来源开始:jekyll new folderName && cd folderName.这将创建一个新的jekyll并进入工作文件夹folderName.

节点模块

要安装必要的节点模块,请在工作文件夹的根目录下创建package.json.

{
  "devDependencies": {
    "browser-sync": "^2.2.0",
    "gulp": "^3.7"
  }
}

使用:npm install从您的工作文件夹安装依赖项(sudo npm install如果它不起作用)

Gulp设置

在工作文件夹的根目录下创建gulpfile.js:

var gulp        = require('gulp');
var browserSync = require('browser-sync');
var cp          = require('child_process');

var messages = {
    jekyllBuild: '<span style="color: grey">Running:</span> $ jekyll build'
};

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

/**
 * Rebuild Jekyll & do page reload
 */
gulp.task('jekyll-rebuild', ['jekyll-build'], function () {
    browserSync.reload();
});

/**
 * Wait for jekyll-build, then launch the Server
 */
gulp.task('browser-sync', ['jekyll-build'], function() {
    browserSync({
        server: {
            baseDir: '_site'
        }
    });
});

/**
 * Watch html/md files, run jekyll & reload BrowserSync
 * if you add folder for pages, collection or datas, add them to this list
 */
gulp.task('watch', function () {
    gulp.watch(['./*', '_layouts/*', '_includes/*', '_posts/*', '_sass/*', 'css/*'], ['jekyll-rebuild']);
});

/**
 * Default task, running just `gulp` will compile the sass,
 * compile the jekyll site, launch BrowserSync & watch files.
 */
gulp.task('default', ['browser-sync', 'watch']);

现在只需gulp在工作文件夹的根目录下运行,它将启动服务器,在默认浏览器中加载页面,每次更新Jekyll文件时,它都会触发jekyll构建,然后自动重新加载浏览器.注意:根据Jekyll构建时间,重新加载浏览器可能需要几秒钟.

有关更多信息,请查看Browsersync.

审查员注意事项(见答案#2)

这就是我所说的建设性行动.我经营一家公司,我尽我所能为社区服务.有时我只有一点时间给予,但我以建设性的方式给予它,试图找到其他人的解决方案,而不是拖曳interwooz!试图证明我可能是邪恶的.你是系统的一部分,你制造系统的邪恶方面,削减知识,因为你认为你拥有真相.(对我来说几乎是Godwin的观点)

我的答案#2在两年内仍然可以,这一年将在一年内过时.模块版本,node.js死于io.js等等.

是的愚蠢真的堆栈式流淌我!

Answer 2

自PR＃5142合并为master 以来，其他答案已过时。

使用调用jekyll serve --livereload。