I'm using angular-cli 1.6.5 node 6.9.1. I'm running my app using the following command:
ng serve --watch
When I make changes to my typescript or HTML sources (e.g. app.component.ts), the browser automatically refreshes.
My question is, how does the browser know when to refresh? I don't see any requests being sent out from the browser to the app and vice versa. And I couldn't see network traffic on my browser other than when the page refreshes.
For clarity, my question is not about how Angular detects changes on DOM elements or model objects bound to it.
ng serve is a great command to use when developing your application locally. It starts up a local development server, which will serve your application while you are developing it. It is not meant to be used for a production environment.
ng serve — This command builds, deploy, serves and every time watches your code changes. if find any change in code it builds and serves that code automatically.
When you use the ng serve command to build an application and serve it locally, the server automatically rebuilds the application and reloads the page when you change any of the source files. When you run ng new my-first-project a new folder, named my-first-project , will be created in the current working directory.
ng serve command builds and serve the application. It rebuilds the application if changes occur. Here project is the name of the application as defined in angular.
ng serve
starts a server which watches for file changes and sends a web socket message to the client with a new hash.
By making the network slower in chrome dev tools we will be able to see the websocket messages as they are sent to the browser:
Make a file change:
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With