CODEWITHSUNDEEP
gulp
Andrey
Andrey

Reputation: 11

Gulp Livereload doesn't work

Gulpfile.js doesn't update my browser. I include all necessary plugins. 

    var gulp = require('gulp'),
    concatCss = require('gulp-concat-css'),
    minifyCss = require('gulp-minify-css'),
    autoprefixer = require('gulp-autoprefixer'),
    notify = require('gulp-notify'),
    livereload = require('gulp-livereload'),
    connect = require('gulp-connect');

    //connect server
    gulp.task('connect', function() {
      connect.server({
        root: 'gulp-project',
        livereload: true
      });
    });

    //css
    gulp.task('css', function() {
     return gulp.src('./*.css')
        .pipe(concatCss("bundle.css"))  
        .pipe(minifyCss())
        .pipe(autoprefixer({
            browsers: ['last 15 versions'],
            cascade: false
        }))
        .pipe(gulp.dest('out/'))
        .pipe(notify("Done!"))
        .pipe(connect.reload());
    });

    //html
    gulp.task('html', function() {
        return gulp.src('index.html')
        .pipe(connect.reload());
    })

    //watch
    gulp.task('watch', function() {
        gulp.watch('*.css',['css'])
        gulp.watch('index.html',['html'])
    });
    gulp.task('default',['connect','html','css','watch'])

Gulpfile.js doesn't update my browser page.I include all necessary plugins. Thank you for your answers.

Upvotes: 0

Views: 1117

Answers (1)

Meir
Meir

Reputation: 14395

Livereload can be quite a story to set up and I think it changed syntax and call params over versions. What used to work for me in the past was:

var livereload = require('gulp-livereload')();

and then whenever you want to trigger it:

livereload.changed(file.path);

I know it breaks your pipe usage, but there are workarounds to that.

Also check that you do not need to start livereload:

    livereload.listen();

This is new in gulp-livereload v 3.x:

gulp-livereload will not automatically listen for changes. You now have to manually call livereload.listen unless you set the option start:

livereload({ start: true })

Upvotes: 1

Related Questions