【问题标题】:Integrate gulp-livereload with Watchify将 gulp-livereload 与 Watchify 集成
【发布时间】:2014-03-28 09:07:30
【问题描述】:

我在 Gulp 监视任务中使用 Substack 的 Watchify 来构建更好的 Browserify,如下所示:

var gulp = require('gulp');
var source = require('vinyl-source-stream');
var watchify = require('watchify');

var hbsfy = require("hbsfy").configure({
  extensions: ["html"]
});

gulp.task('watch', function() {
    var bundler = watchify('./public/js/app.js');

    bundler.transform(hbsfy);

    bundler.on('update', rebundle);

    function rebundle() {
        return bundler.bundle()
            .pipe(source('bundle.js'))
            .pipe(gulp.dest('./public/dist/js/'));
    }

    return rebundle();
});

试图弄清楚如何将 Live Reload 合并到任务中,以便在 Watchify 完成时触发它。知道我会怎么做吗?

【问题讨论】:

    标签: node.js browserify livereload gulp


    【解决方案1】:

    你试过在gulp.dest()之后使用gulp-livereload吗?

    你应该可以简单地插入这个:

    .pipe(livereload())
    

    这假定bundler.bundle() 管道正确的数据类型。

    【讨论】:

    • vinyl-source-stream(在他的代码中为.pipe(source('bundle.js')))获取从bundler.bundle() 输出的文本流,并使其成为gulp 使用的乙烯基文件流,替换gulp.src()。因此,其他 gulp 插件可以在此之后通过管道传输。
    • 还要注意,如果你使用 gulp-connect,你可以.pipe(connect.reload())
    • 我发现,.pipe(livereload()) 是不够的,你必须添加.pipe(livereload({start: true})) 否则 LiveReload 服务器将无法启动(显然你也可以在脚本的其他地方启动服务器)。自 3.x 以来,必须启动监听器似乎是一个变化
    猜你喜欢
    • 2015-03-02
    • 2017-03-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-02-19
    • 2015-11-25
    • 2023-03-29
    相关资源
    最近更新 更多