avevlad / gulp-connect

Gulp plugin to run a webserver (with live reload)
https://npmjs.org/package/gulp-connect
MIT License
632 stars 113 forks source link

[Livereload] connect.reload doesn't work , please help me...... #210

Open zhaihaoran opened 7 years ago

zhaihaoran commented 7 years ago

thank you everyone! i find the answer to solve my problom

http://stackoverflow.com/questions/21699146/gulp-js-task-return-on-src

levithomason commented 7 years ago

Confirming the same issue here. Here's a repo: https://github.com/levithomason/gulp-connect-livereload

I've copied the example in the README.md to a repo with a single /app/index.html file and livereload does not work. npm start to run it. The html task does refire on html changes, but there is no reload happening.

This plugin was working for me some time ago, I'm going to see if I can find and older version that still works.

levithomason commented 7 years ago

Well, I cannot get v3/4/5 to work. Completely confused here.

leedium commented 7 years ago

Try returning the stream so ie: gulp.task('html', function () { return gulp.src('./app/*.html') .pipe(connect.reload()); });

http://stackoverflow.com/questions/21699146/gulp-js-task-return-on-src

levithomason commented 7 years ago

The original project where the issue was noticed certainly returned all streams. The repo above is copied from the README.md, showing the example doesn't work.

https://github.com/AveVlad/gulp-connect/blob/master/README.md#livereload

herebefrogs commented 7 years ago

@zhaihaoran @levithomason I was able to make the livereload example from the README.md work by installing the LiveReload extension for Chrome: https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei

Then run 'gulp', load http://localhost:8080 in Chrome and click the 'LiveReload' icon in the top right corner of your location bar. This will inject the following script tag into your HTML page:

From now on, any change to a file that is watched will reload automatically in your browser.

Alternatively, I suppose you can do away with the Chrome extension by inlining that script tag in your HTML directly. Just remember to remove it when you ship your code.

Hope this helps.

herebefrogs commented 7 years ago

@AveVlad I guess the issue seems to be the isn't injected automatically in the HTML pages served by gulp-connect.

Is it part of the contract of gulp-connect to do so or not?

levithomason commented 7 years ago

Hm, I've never had the extension and this plugin worked for me once upon a time. After posting the issue here I switched to gulp-webserver as I needed something that worked right away. I'm not sure what the issue is but gulp-connect was working great in several projects, then suddenly was not.

aysenz commented 7 years ago

Try close another livereload process) port conflict)

koertvankleef commented 6 years ago

What made all the difference in my case was to execute the tasks as series (Gulp4) gulp.series('build', 'reload') And of course have any tasks prior to reload return a value.