Live reload fails - Failed to load resource: net::ERR_CONNECTION_REFUSED

Question

I am starting live reload via Gulp:

var $$ = require('gulp-load-plugins')();

gulp.watch('*', function (file) {
  $$.livereload().changed(file.path);
});

gulp.task('connect', function(){
  var connect = require('connect');
  return connect()
    .use(require('connect-livereload')())
    .use(connect.static(__dirname))
    .listen(8000);
});

It had been working until I recently got this cryptic error in the browser console and reload stopped working:

Failed to load resource: net::ERR_CONNECTION_REFUSED
http://localhost:35729/livereload.js?snipver=1

Any idea what happens here?

I am behind proxy but localhost is excluded.

Bertabertasi

Are you using some adblock, disconnect or ghostery addon? – Squashy

@Aperçu No, adblock is disabled, no such addons. – Bertabertasi

When does this error happen? This message indicates, that the livereload server isn't running (anymore). Also there shouldn't be parentheses for the livereload plugin - just $$.livereload.changed(file.path); – Titleholder

I've always found liveReload a very buggy app. It doesn't need a lot to crash. – Shortlived

It is not an app, just a node module. And yes, it is not perfect but I've managed eventually to get it work. But its newer "competitor" browser-sync also gave me some troubles. – Bertabertasi

Do you have something else running on :8000? Try running on :8001, or :8080, etc. – Bryon

Answer 1

I've been using Browsersync for along time after I had issues with Live-Reload, and here's my setup for Browsersync ...

var browsersync = require('browser-sync'));

//BrowserSync Function
gulp.task('browser-sync', function() {
    browsersync({
        // Change the director name for static site
        server: {
            baseDir: "./builds/development"
        }
    });
});

// Browser Sync reload function
gulp.task('browsersync-reload', function () {
    browsersync.reload();
});

// Server and Watch Function
gulp.task('server', ['browser-sync'], function() {
    gulp.watch("components/sass/**/*.scss", ['sass']);
    gulp.watch("html_pages/**/*.html", ['html']);
    gulp.watch("builds/development/*.html", ['browsersync-reload']);
    gulp.watch("components/scripts/**/*.js", ['js']);
});

Hope it helps.

Connote