##Angular CLI (ng serve)
To run the standard angular-cli ng serve
on a Cloud9 box, you need to specify the cloud9 specific ports the preview runs off as well as define a live preview port. So instead of the angular-cli command of ng serve
, run the following:
ng serve --host 0.0.0.0 --port 8080 --live-reload-port 8081
The port configuration is the important part to make sure it is accessible to preview. Once running, preview the App as per usual in Cloud9 via the "Preview" button (no need to use the "Run" button).
To make things easier, you can assign that command to an alias:
alias ngs='ng serve --host 0.0.0.0 --port 8080 --live-reload-port 8081'
Now you just type ngsc9
to do the same thing (ngsc9 for me stands for ng serve but make yours whatever you want).
##Express server
If you are running an Express server instead, perhaps as a part of a full MEAN stack, you can do the below:
node server.js --host 0.0.0.0 --port 8080
or if you are using nodemon (npm install -g nodemon
) to monitor and reload the server when server files change:
nodemon server.js --host 0.0.0.0 --port 8080
Again you can assign that to an alias:
alias ngsc9='nodemon server.js --host 0.0.0.0 --port 8080'
I've yet to get live reload happening on express, if you have done that, please add your comments below so we can update this gist.
###Building and watch on Cloud9
Now the server is up and running, you can build and watch for change files as per normal via the angular cli via ng build --watch
.
Note if you are on the free tier of Cloud9, the first build run is very slow I assume due to the limited specs of that server tier.
I had to run with --public-host but I had to use my explicit URL
ng serve --host 0.0.0.0 --port 8080 --public-host https://app-name-username.c9users.io
(replace https://app-name-username.c9users.io with yours)