5

I'm using Substack's Watchify for better Browserify builds, within a Gulp watch task, like so:

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();
});

Trying to figure out how I can incorporate Live Reload into the task, so it triggers when Watchify has done it's thing. Any idea how I would do this?

benhowdle89
  • 36,900
  • 69
  • 202
  • 331

1 Answers1

7

Have you tried using gulp-livereload right after your gulp.dest()?

You should be able simply insert this:

.pipe(livereload())

This assumes that bundler.bundle() pipes the correct data types.

OverZealous
  • 39,252
  • 15
  • 98
  • 100
  • 1
    [vinyl-source-stream](https://github.com/hughsk/vinyl-source-stream) (`.pipe(source('bundle.js'))` in his code) takes the text stream piped out from `bundler.bundle()` and makes it the vinyl file stream that gulp uses, replacing `gulp.src()`. Thus other gulp plugins can be piped after that. – DSKrepps Feb 28 '14 at 00:27
  • 1
    Note also, that if you're using gulp-connect, you can `.pipe(connect.reload())` – Daniel Naab Aug 07 '14 at 23:27
  • I found, `.pipe(livereload())` is not enough, you have to add `.pipe(livereload({start: true}))` or the LiveReload server will not be started (obviously you can also start the server somewhere else in your script). Having to start the listener seems to be a change since 3.x – Lukas Feb 09 '15 at 00:13