node.jsgrunt-contrib-watchgrunt-contrib-connect

grunt-contrib-watch with livereload with vs without grunt-contrib-connect


I am new to Node,grunt and I use both grunt-contrib-watch and grunt-contrib-connect.

As far as I understand, watch task with livereload = true option reruns the mentioned tasks of the target and refreshes the browser by triggering a livereload server to serve reloaded static files.

However, if browser reload and static file serve happens with just watch task with livereload=true option, why do we need grunt-contrib-connect again for the same job.

Thanks.


Solution

  • The opetion of livereload in grunt-contrib-watch is responsible to trigger websocket request to browser to reload the page. It is not a http server. From what i remember grunt-contrib-connect is simply an HTTP server. Remember that grunt-contrib-watch starts websocket server at port 35736 so add the script

    <script src="//localhost:35729/livereload.js"></script>
    

    To trigger live reload in browser.

    Hope this clarifies what you need