Command-Line Options ng serve has built-in option flags to update host and port: --port : port to listen on; defaults to 4200. --host : host to listen on; defaults to localhost.
If you want to quit ng serve , you should use Ctrl+C instead, in which will also release the 4200 port.
In the latest version of Angular, this is set in the angular.json
config file. Example:
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"projects": {
"my-project": {
"architect": {
"serve": {
"options": {
"port": 4444
}
}
}
}
}
}
You can also use ng config
to view/edit values:
ng config projects["my-project"].architect["serve"].options {port:4444}
In previous versions, this was set in angular-cli.json
underneath the defaults
element:
{
"defaults": {
"serve": {
"port": 4444,
"host": "10.1.2.3"
}
}
}
As of right now that feature is not supported, however if this is something that bothers you an alternative would be in your package.json...
"scripts": {
"start": "ng serve --host foo.bar --port 80"
}
This way you can simply run npm start
Another option if you want to do this across multiple projects is to create an alias, which you can potentially name ngserve
which will execute your above command.
You can configure the default HTTP port and the one used by the LiveReload server with two command-line options :
ng serve --host 0.0.0.0 --port 4201 --live-reload-port 49153
https://github.com/angular/angular-cli
This changed in the latest Angular CLI.
The file name changed to angular.json
, and the structure also changed.
This is what you should do:
"projects": {
"project-name": {
...
"architect": {
"serve": {
"options": {
"host": "foo.bar",
"port": 80
}
}
}
...
}
}
Another option is to run ng serve
command with the --port
option e.g
ng serve --port 5050
(i.e for port 5050)
Alternatively, the command: ng serve --port 0
, will auto assign an available port for use.
We have two ways to change default port number in Angular.
First way is by CLI command:
ng serve --port 2400 --open
Second way is by configuration at the location:
ProjectName\node_modules\@angular-devkit\build-angular\src\dev-server\schema.json.
Make changes in schema.json file.
{
"title": "Dev Server Target",
"description": "Dev Server target options for Build Facade.",
"type": "object",
"properties": {
"browserTarget": {
"type": "string",
"description": "Target to serve."
},
"port": {
"type": "number",
"description": "Port to listen on.",
"default": 2400
},
You can save these in a file, but you have to to put it in .ember-cli
(at the moment, at least); see https://github.com/angular/angular-cli/issues/1156#issuecomment-227412924
{
"port": 4201,
"liveReload": true,
"host": "dev.domain.org",
"live-reload-port": 49153
}
edit: you can now set these in angular-cli.json as of commit https://github.com/angular/angular-cli/commit/da255b0808dcbe2f9da62086baec98dacc4b7ec9, which is in build 1.0.0-beta.30
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