Ember-cli with liveload in cloud9

Ember CLI
1

Has anyone got Ember-cli working in cloud9 with livereload?

I keep getting GET https://ember-material-andrantis.c9users.io:49152/livereload.js?snipver=1 net::ERR_TUNNEL_CONNECTION_FAILED

2

You have to change the livereload port to 8081 (cloud9 only has opened ports 8080, 8081 and 8082 if I remember correctly).

Add: “live-reload-port”: 8081 to your .ember-cli file

EDIT: oh, and don’t forget to update your CSP to allow connections with cloud9.

i.e.: ‘connect-src’: “‘self’ wss://myapp-username.c9users.io:8081”, ‘script-src’: “‘self’ https://myapp-username.c9users.io:8081”,

1 Like
3

Ahh… I forgot about updating the CSP, that actually did the trick. Thank you so much!

4

were you able to do this with a free account?

5

Yes, with a free account.

6

What workspace did you choose? After you chose a workspace, did you just do the following?

npm install -g ember-cli
ember new demo-app

changed the settings above

cd demo-app
ember serve
7

I choose the html 5 workspace and the usual install as you said. I did also install Watchman. Everything seems to run nicely.

8

Is the folder that gets created from ember new sitting inside the root folder cloud 9 gives you when you create that workspace?

9

Yes. Are you having issues to get it to work?

10

heh ya. I did the above, cd’ed into the ember project that got created, ran ember serve, and that’s where I get stuck…

11

And then you need to open a browser window with https://APPNAME-YOURUSERNAME.c9users.io:8080/

You might be getting errors with the contentSecurityPolicy. You can add that in config/enviroment.js. Mine looks like this now, is not the right way setting * for everything but I was trying to make it work at some point and haven’t changed it back.

ENV.contentSecurityPolicy = {
    'script-src':  "*",
    'font-src':    "*",
    'connect-src': "'self' wss://APPNAME-YOURUSERNAME.c9users.io:8081/",
    'style-src':   "'self' https://APPNAME-YOURUSERNAME.c9users.io:8081/",
    'object-src':  "*",
    'img-src':     "*"
  };

Also remember to add to your .ember-cli file the following: "live-reload-port": 8081

1 Like
12

Thanks a lot @andrantis! Got it working :slightly_smiling:

13

Hey is this conversation still relative? I did what I had to (install node, npm watchman and followed brady’s suggestion about git) and my demo app seems to be running (tomster is appearing). To be fair there was no .ember-cli folder to begin with under the vendor file, only ember-cli-build.js and a couple of files more.

Am I doing something grossly wrong or is this how things look now? (No need to change to port 8081 for live reload etc?)

@skaterdav85 I tried to follow your video but to no avail.

Will really appreciate feedback.

14

Unfortunately I haven’t tried Cloud 9 since that video, so things may have changed and my video could be out of day.

15

Cool. What are u using right now if u dont mind me asking? I felt a bit disappointed recently with cloud9 regarding their elastic search support… not really their fault as it is hogging resources but still I felt a bit disenchanted.

16

I just develop locally using Atom, NVM, node 7. :slight_smile:

1 Like
17

I found there are no “.ember-cli” file. After searching for some information, I found that the file is hidden. Here is the method to un-hidden it.

upper left Cloud9

preferences option user settings, select tree & navigate

Hope this will help those has same problem.