Gulp LiveReload for PHP files, wont't refresh browser

Question

Building myself a gulpfile.js for a WordPress theme. Currently all the JS and CSS is working perfectly, and livereload is reloading on css/js change.

But I also want to refresh the browser whenever a PHP file is changed. I did some searching and found the following snipped which I'm using within my gulpfile.js

gulp.task('watch', function(){

    // Listen on port 35729 for LiveReload
    server.listen(35729, function (err) {if (err) {return console.log(err) };
        gulp.watch("assets/scss/**/*.scss", ['sass']);              // Watch and run sass on changes
        gulp.watch("assets/js/_*.js", ['javascripts']);             // Watch and run javascripts on changes
        gulp.watch("assets/img/*", ['imagemin', 'svgmin']);     // Watch and minify images on changes

        gulp.watch('**/*.php').on('change', function(file) {
            util.log('PHP FILES CHANGED!');
            server.changed(file.path);
        });

    });
});

Whenever I change a PHP file I can see "PHP FILES CHANGED!" in the console, but livereload does not update the browser. What am I missing?

Sandrocottus

Answer 1

Did some further research and testing, and it turns there's no point in using tiny-lr since gulp-livereload does everything. So I changed my tasks to do the reloading by .pipe(livereload()); – and changed my watch task to the following:

gulp.task('watch', function(){

    var server = livereload();
    gulp.watch('**/*.php').on('change', function(file) {
          server.changed(file.path);
          util.log(util.colors.yellow('PHP file changed' + ' (' + file.path + ')'));
      });

    gulp.watch("assets/scss/**/*.scss", ['sass']);              // Watch and run sass on changes
    gulp.watch("assets/js/_*.js", ['javascripts']);             // Watch and run javascripts on changes
    gulp.watch("assets/img/*", ['imagemin', 'svgmin']);     // Watch and minify images on changes

});

Sandrocottus

Thanks! been trying to get livereload working with php files for a while now and this works perfectly. – Tanker

you should mark your answer as correct to bump it up when people search for this – Sis

Answer 2

There's a shorter solution that maybe useful to those using gulp-livereload. There's a reload method that can be triggered. Like so:

gulp.task('watch', function(){
    livereload.listen();

    gulp.watch('source/*.php', livereload.reload);
});

Monophonic

First answer didn't work for me, but this one did. Also less intrusive and seems to align closer with Gulp practices. I'd vote for this as the correct answer here. – Linebreeding