How to set up live reload with c9 with Jekyll, JSON, and browser-sync

workspace
nodejs
jekyll

#1

I’ve tried various configurations but can’t get browser-sync to refresh the page with Jekyll and JSON using terminal in C9 IDE.

Versions

Node v4.4.5
npm v2.15.5
Browsersync v2.14.0
My setup

As instructed, I put the browser-sync script in my HTML file before the ending of the

<script id="__bs_script__">//<![CDATA[
    document.write("<script async src='http://HOST:8080/browser-sync/browser-sync-client.2.14.0.js'><\/script>".replace("HOST", location.hostname));
//]]></script>

Then in my package.json file I created the following two scripts:

 "scripts": {
    "jekyll": "jekyll serve --host $IP --port 8080",
    "sync": "browser-sync start --proxy https://mylocaldev.c9users.io --port 8080 --files _posts/*.md"
  }

Finally, I run npm run jekyll and thennpm run sync

I get the following output:

[BS] Proxying: https://mylocaldev.c9users.io
[BS] Access URLs:

   Local: https://localhost:8081
External: https://172.17.36.34:8081
      UI: http:    //localhost:3001
    UI External: http://172.17.36.34:3001

[BS] Watching files...

The changes are being logged, but the page is not being updated automatically. And the local access url says there is a proxy error.

Not exactly sure how poxy works. Is the --port supposed to be the same one I am running Jekyll on? I’ve played around with different configurations but can’t get this to run properly. What am I doing wrong?

Thanks.


#2

i found that, for jekyll, browser-sync is better than live-reload