”;
This chapter explains the syntax, argument and options of ng serve command along with an example.
Syntax
The syntax for ng serve command is as follows −
ng serve <project> [options] ng s <project> [options]
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.json.
Arguments
The argument for ng serve command is as follows −
| Sr.No. | Argument & Syntax | Description |
|---|---|---|
| 1 | <project> | The name of the project to build. Can be an application or a library. |
Options
Options are optional parameters.
| Sr.No. | Option & Syntax | Description |
|---|---|---|
| 1 | –allowedHosts | Whitelist of hosts that are allowed to access the dev server. |
| 2 | –aot=true|false | Build using Ahead of Time compilation. |
| 3 | –baseHref=baseHref | Base url for the application being built. |
| 4 | –buildEventLog=buildEventLog | EXPERIMENTAL Output file path for Build Event Protocol events |
| 5 | –commonChunk=true|false | Use a separate bundle containing code used across multiple bundles. |
| 6 | –configuration=configuration |
A named build target, as specified in the “configurations” section of angular.json. Each named target is accompanied by a configuration of option defaults for that target. Setting this explicitly overrides the “–prod” flag.
Aliases: -c
|
| 7 | –deployUrl=deployUrl | URL where files will be deployed. |
| 8 | –disableHostCheck=true|false |
Don”t verify connected clients are part of allowed hosts.
Default: false
|
| 9 | –help=true|false|json|JSON |
Shows a help message for this command in the console.
Default: false
|
| 10 | –hmr=true|false |
Enable hot module replacement.
Default: false |
| 11 | –hmrWarning=true|false |
Show a warning when the –hmr option is enabled.
Default: true
|
| 12 | –host=host |
Host to listen on.
Default: localhost
|
| 13 | –liveReload=true|false |
Whether to reload the page on change, using live-reload.
Default: true
|
| 14 | –open=true|false |
Opens the url in default browser.
Default: false
Aliases: -o
|
| 15 | –optimization=true|false | Enables optimization of the build output. |
| 16 | –poll | Enable and define the file watching poll time period in milliseconds. |
| 17 | –port |
Port to listen on.
Default: 4200
|
| 18 | –prod=true|false | Shorthand for “–configuration=production”. When true, sets the build configuration to the production target. By default, the production target is set up in the workspace configuration such that all builds make use of bundling, limited tree-shaking, and also limited dead code elimination. |
| 19 | –progress=true|false | Log progress to the console while building. |
| 20 | –proxyConfig=proxyConfig | Proxy configuration file. |
| 21 | –publicHost=publicHost | The URL that the browser client (or live-reload client, if enabled) should use to connect to the development server. Use for a complex dev server setup, such as one with reverse proxies. |
| 22 | –servePath=servePath | The pathname where the app will be served. |
| 23 | –servePathDefaultWarning=true|false |
Show a warning when deploy-url/base-href use unsupported serve path values.
Default: true |
| 24 | –sourceMap=true|false | Output sourcemaps. |
| 25 | –ssl=true|false |
Serve using HTTPS.
Default: false
|
| 26 | –sslCert=sslCert | SSL certificate to use for serving HTTPS. |
| 27 | –sslKey=sslKey | SSL key to use for serving HTTPS. |
| 28 | –vendorChunk=true|false | Use a separate bundle containing only vendor libraries. |
| 29 | –verbose=true|false | Adds more details to output logging. |
| 30 | –watch=true|false |
Rebuild on change.
Default: true
|
First move to an angular project updated using ng build command and then run the command.The chapter is available at https://www.tutorialspoint.com/angular_cli/angular_cli_ng_build.htm.
Example
An example for ng serve command is given below −
>Node>TutorialsPoint> ng serve
chunk {main} main.js, main.js.map (main) 14.3 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 141 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 12.4 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 3 MB [initial] [rendered]
Date: 2020-06-04T04:01:47.562Z - Hash: a90c5fc750c475cdc4d1 - Time: 10164ms
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
: Compiled successfully.
Here ng serve command has built and serve our project TutorialsPoint successfully.Now open http://localhost:4200 in a browser window and verify the output.
”;