0

I'm new to using Gulp (especially Gulp 4) and to start of I just want to have a very basic live reload on any changes in my index.html file (in the root folder). So far I have this:

var gulp = require("gulp"),
browserSync = require("browser-sync").create();

// Static server
gulp.task('browser-sync', function() {
    browserSync.init({
        server: {
            baseDir: "./"
        }
    });
});

gulp.task('default', ['html'], function() {
    // watch for HTML changes
    gulp.watch('*.html', function() {
       // run styles upon changes
       gulp.run('html');
    });
 });

How do I connect the browser-sync task with the gulp watch? I have tried using the official documentation but the examples there seem to be more complex than what I am trying to achieve.

CorinLUSI
  • 21
  • 6

1 Answers1

0

Change to:

gulp.task('default', gulp.series('html', function() {
  // watch for HTML changes
  gulp.watch('*.html', gulp.series('html'))
}));

and see a how to migrate from gulp v3 to v4 guide since most of the code you are going to find is v3.

Mark
  • 143,421
  • 24
  • 428
  • 436
  • Unfortuanetly this didn’t work for me. I’ve decided to use Parcel JS instead and it worked perfectly for my basic needs. – CorinLUSI Feb 25 '20 at 22:08