How to use grunt serve in Cloud9 IDE?

Question

In my Gruntfile.js I have tried to do this:

connect: {
  options: {
    port: process.env.PORT,
    hostname: process.env.IP,
    livereload: 35729
  }
}
         


        

Answer 1

Apparently, you can actually get Livereload working on Cloud9 when using Apache as web-server, by proxying the websocket request to grunt-watch with "mod_proxy_wstunnel":

1) Add the following directive to /etc/apache2/mods-available/proxy_wstunnel.load

ProxyPass /livereload/ ws://127.0.0.1:35729/

2) Enable "mod_proxy_wstunnel" and it's dependency "mod_proxy"

ln -s /etc/apache2/mods-available/proxy_wstunnel.load /etc/apache2/mods-enabled/proxy_wstunnel.load
ln -s /etc/apache2/mods-available/proxy.load /etc/apache2/mods-enabled/proxy.load

3) Restart Apache

service apache2 restart

4) So far so good, now you must hardcode the websocket URL that Livereload will be using, by modifying the livereload.js script, in my particular case this was located at ~/myworkplace/grunt-contrib-watch/node_modules/tiny-lr/lib/public/livereload.js, you need to change the following line:

this._uri = "ws://" + this.options.host + ":" + this.options.port + "/livereload/";

to

this._uri = "ws://YOUR_WORK_PLACE.c9.io/livereload/";

5) Last but not least, you must reference the livereload.js script directly in your desired page, in my particular instance:

Hope this might help someone and especially save some time :)