0

I have an angular 4 application which is set up in Nanobox.

On the local machine it runs on localhost:4200 on the Nanobox I run it on http://172.21.0.5:4200/ as per Nanobox suggestion.

When the application load in http://172.21.0.5:4200/ I get this error: zone.js:2933 GET http://localhost:4200/sockjs-node/info?t=1508200471270 net::ERR_CONNECTION_REFUSED

This error doesn't happen in Localhost, and because of that error my live reload is not working.

Thanks in advance.

Edit

It is dev environment. I need somehow tell angular file watcher to communicate with http://0.0.0.0:4200 or http://172.21.0.5:4200

I don't know where is the angular live reload script. I can't find anything online either. I thought it is Webpack, but I can't find anything about it.

Mr H
  • 5,254
  • 3
  • 38
  • 43
  • Live reload is a development time feature, it's not something that you use in production to update your application – Aluan Haddad Oct 17 '17 at 02:36
  • I am not using it in the Production. Nanobox is my development environment. – Mr H Oct 17 '17 at 03:51
  • Then why? localhost will be faster. – Aluan Haddad Oct 17 '17 at 03:59
  • Using Nanobox or Docker will isolate the local environment. Also you can simply push that into production, and manager your server with no issues. In the production I will `ng build` it. – Mr H Oct 17 '17 at 04:01

2 Answers2

0

As per understanding you wanted to run angular application on client machine, to do so follow 3 simple steps

1) enable prod mode-

import { enableProdMode } from '@angular/core';

// Enable production mode unless running locally
if (!/localhost/.test(document.location.host)) {
  enableProdMode();
}

2) build application in prod mode- base will be set in index.html to navigate all CSS and js files ng build prod --base="/folderName/"

3) deploy dist folder and explore.

mangeshbhuskute
  • 140
  • 7
  • I don't need Prod Mode as it is a dev server. Nanobox is like Docker. I need to somehow tell my live reload to communicate with `http://0.0.0.0:4200` – Mr H Oct 17 '17 at 03:53
0

After lots of digging, there is no straight answer for this.

Here is my solution with Nanobox:

Grab the IP Address that Nanobox suggests:

enter image description here

Then use ng serve -host 172.21.0.5 this should bypass the issue of livereload.

Also in your boxfile.yml make sure you use fs_watch: true.

Nanobox is looking at 0.0.0.0 so you need to make sure in your angular-cli.json in the default section add:

"defaults": {
    "styleExt": "scss",
    "component": {},
    "serve": {
      "port": 4200,
      "host": "0.0.0.0"
    }
  }

This should do it.

Mr H
  • 5,254
  • 3
  • 38
  • 43