tutorial cli check angular-cli

angular cli - cli - Cómo cambiar el puerto angular de 4200 a cualquier otro



install angular 5 (19)

Quiero usar 5000 en lugar de 4200 ..

Lo que he intentado es haber creado un archivo en el nombre raíz ember-cli y poner JSON de acuerdo con el siguiente código:

{ "port": 5000 }

Pero mi aplicación todavía se ejecuta en 4200 en lugar de 5000


Aunque ya hay numerosas soluciones válidas en las respuestas anteriores, aquí hay una guía visual y una solución específica para proyectos de Angular 7 (posiblemente también versiones anteriores, aunque no hay garantías) usando Visual Studio Code. Localice el schema.json en los directorios como se muestra en el árbol de imágenes y modifique el número entero en puerto -> predeterminado para un cambio permanente de puerto en el navegador.


Cambiar nodel_modules/angular-cli/commands/server.js es una mala idea, ya que se actualizará cuando instale una nueva versión de angular-cli . En su lugar, debe especificar ng serve --port 5000 en package.json esta manera:

"scripts": { "start": "ng serve --port 5000" }

También puede especificar el host con --host 127.0.0.1


Ejecute el siguiente comando para otro que no sea 4200

ng serve --port 4500


En angular.json:

"serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { "browserTarget": "projectname:build", "port": 5000 }

Estoy usando angular-cli. Esto funcionó para mí.


La solución que funcionó para mí fue

ng serve --port 4401

(Puede cambiar 4401 al número que desee)

Luego inicie el navegador -> http://localhost:4401/

Básicamente, tenía dos aplicaciones y con la ayuda del enfoque anterior ahora puedo ejecutar ambas simultáneamente en mi entorno de desarrollo.


La ubicación de la configuración del puerto ha cambiado un par de veces.

Si usa CLI angular 1

Cambiar angular-cli.json

{ "defaults": { "serve": { "host": "0.0.0.0", "port": 5000 } } }

Si usa la última CLI angular

Cambiar angular.json

"projects": { "project-name": { ... "architect": { "serve": { "options": { "host": "0.0.0.0", "port": 5000 } } } ... } }

Sin cambiar ningún archivo

Ejecuta el comando

ng serve --host 0.0.0.0 --port 5000


Nadie ha actualizado la respuesta para la última CLI angular. Con la última Angular CLI

Con la latest version de angular-cli en la que angular-cli.json cambia de nombre a angular.json , puede cambiar el puerto editando el archivo angular.json que ahora especifica un puerto por "project"

projects": { "my-cool-project": { ... rest of project config omitted "architect": { "serve": { "options": { "port": 4500 } } } } }

Lea más sobre esto here


Parece que las cosas han cambiado en versiones recientes de la CLI (estoy usando 6.0.1 ). Pude cambiar el puerto predeterminado utilizado por ng serve agregando una opción de port al angular.json mi proyecto:

{ "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "projects": { "my-project": { "architect": { "serve": { "options": { "port": 4201 } } } } } }

(Solo las propiedades relevantes se muestran en este ejemplo).


Puede cambiar el puerto de su aplicación ingresando el siguiente comando,

ng serve --port 4200

Además, para una configuración permanente, puede cambiar el puerto editando el archivo angular-cli.json

"defaults": { "serve": { "port": 8080 } }


Puede editar el número de puerto predeterminado que está configurado en el archivo serve.js.

La ruta será project_direcory/node_modules/angular-cli/commands/serve.js .

Busque esta línea -> var defaultPort = process.env.PORT || 4200; var defaultPort = process.env.PORT || 4200;
Reemplace con esta línea -> var defaultPort = process.env.PORT || 5000; var defaultPort = process.env.PORT || 5000;


Solo corre

ng serve --port yourport

Ejemplo:

ng serve --port 4401


También puede escribir este comando: ng serve -p 5000


Tenemos dos formas de cambiar el número de puerto predeterminado en Angular.

Primera forma de comando cli:

ng serve --port 2400 --open

La segunda forma es mediante la configuración en la ubicación: ProjectName/node_modules/@angular-devkit/build-angular/src/dev-server/schema.json .

Realice cambios en el archivo schema.json .

{ "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 },


Usualmente uso el comando ng set para cambiar la configuración de CLI angular para el nivel de proyecto.

ng set defaults.serve.port=4201

Los cambios cambian su .angular.cli.json y agrega la configuración del puerto como se mencionó anteriormente .

Después de este cambio, puede usar simplemente ng serve y usará el puerto preferido sin la necesidad de especificarlo cada vez.


en angular 2 ++.

Para cambiar el puerto, puede ejecutar el siguiente comando en la terminal:

ng serve --host 0.0.0.0 --port 5000.


ir a este archivo

node_modules/@angular-devkit/build-angular/src/dev-server/schema.json

y buscar puerto

"port": { "type": "number", "description": "Port to listen on.", "default": 4200 },

cambie el valor predeterminado que desee y reinicie el servidor


simplemente ejecute ng serve --port 5000 --open


también puede ingresar el siguiente comando en su cli angular, donde normalmente ingresa npm start

ng serve --host "dirección IP" --port "número de puerto"


  • Para permanente:

    Ir a nodel_modules / angular-cli / command / server.js Buscar var defaultPort = process.env.PORT || 4200; y cambie 4200 a cualquier otra cosa que desee.

  • Para ejecutar ahora:

    ng serve --port 4500 (Usted cambia 4500 a cualquier número que desee usar como puerto)