gulp-webserver icon indicating copy to clipboard operation
gulp-webserver copied to clipboard

livereload: true refreshes page fully on Sass edit

Open reintroducing opened this issue 11 years ago • 6 comments

When I have the livereload option set to true it works but there are two issues:

  1. It seems like it runs twice when two tasks are run under one watch. example in config:
watch([
    config.js + '/**/*.js',
    '!' + config.js + '/main.js'
], function(files, cb) {
    gulp.start('lint', cb);
    gulp.start('browserify', cb);
});

When I edit a JS file it runs linting and browserify. A reload happens after the lint and a second reload happens after browserify is run. How can I avoid this so that only one reload gets fired (preferably after browserify)?

  1. When I edit a sass file and run compass to compile it, a full page refresh happens rather than an injection of the styles (as I was used to happening in Grunt, updated the css without a page refresh, just injected them right in so you don't lose your spot on the page). Here is my config for the Sass watch:
watch(config.sass + '/**/*.scss', function(files, cb) {
    gulp.start('compass-dev', cb);
});

Is there a way to do this with gulp-webserver so that it injects the CSS rather than reloading the page?

Many thanks for any help offered.

reintroducing avatar Sep 08 '14 20:09 reintroducing

:+1:

letanure avatar Sep 09 '14 16:09 letanure

@reintroducing It's best practices, when reporting issues to create 1 issue per Issue. So you have 2 issues now:

  1. Support manually reloading contents, like in gulp-connect
  2. Support partial reload, like from Grunt

I'll take a look at the source of gulp-connect and see if I can implement manually reloading, like gulp-connect had.

davejlong avatar Sep 09 '14 20:09 davejlong

Regarding this point 1. Support manually reloading contents, like in gulp-connect, this was already clarified with #13. But I am still not happy with the advice by @schickling to move compiled files to different folders. This seems not be valid for all scenarios. Thus, a manual reload() seems to help some of us.

mhoyer avatar Sep 10 '14 16:09 mhoyer

@schickling looking into the configuration, I'd propose the following changes to support manually reloading in livereload.

  1. Add configuration to livereload property to set it to it to manual reload or automatic (automatic by default)
  2. Change the API of gulp-webserver to export the webserver object as well as a reload method, like in gulp-connect.

I'm not sure if the change for point 2 will require breaking backwards compatibility or if I can add the reload method onto the already exported webserver.

davejlong avatar Sep 10 '14 17:09 davejlong

  1. Seems good!
  2. Setting a object property should do the trick, like webserver.reload()

schickling avatar Sep 11 '14 11:09 schickling

:thumbsup: Yes please! :)

andymerskin avatar Sep 29 '14 19:09 andymerskin