Jak zmienić port kątowy z 4200 na dowolny inny

Chcę użyć 5000 zamiast 4200 ..

Próbowałem utworzyć plik o nazwie root ember-clii umieścić JSON zgodnie z poniższym kodem:

{
   "port": 5000
}

Ale moja aplikacja nadal działa na 4200 zamiast 5000

Rozwiązaniem było dla mnie

ng serve --port 4401    

(Możesz zmienić 4401 na dowolny numer)

Następnie uruchom przeglądarkę -> http: // localhost: 4401 /

Zasadniczo miałem dwie aplikacje i dzięki powyższemu podejściu mogę teraz uruchomić obie z nich jednocześnie w moim środowisku programistycznym.

Możesz zmienić port aplikacji, wprowadzając następujące polecenie,

ng służyć --port 4200

Ponadto, aby uzyskać stałą konfigurację, możesz zmienić port, edytując plik angular-cli.json

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

Wygląda na to, że coś się zmieniło w ostatnich wersjach CLI (używam 6.0.1). Byłem w stanie zmienić domyślny port używany ng serveprzez dodanie portopcji do mojego projektu angular.json:

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

(W tym przykładzie pokazano tylko odpowiednie właściwości).

Zmiana nodel_modules/angular-cli/commands/server.jsjest złym pomysłem, ponieważ zostanie zaktualizowana po zainstalowaniu nowej wersji angular-cli. Zamiast tego należy podać ng serw --port 5000 w package.jsonnastępujący sposób:

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

Możesz także określić host za pomocą --host 127.0.0.1

Lokalizacja ustawień portu zmieniła się kilka razy.

Jeśli używasz Angular CLI 1

Zmiana angular-cli.json

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

Jeśli używasz najnowszego Angular CLI

Zmiana angular.json

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

Bez zmiany żadnego pliku

Uruchom polecenie

ng serve --host 0.0.0.0 --port 5000

Nikt nie zaktualizował odpowiedzi na najnowszy interfejs Angular CLI Angular CLI

Z latest versionangular-cli, w którym przemianowano na angular-cli.json angular.json, możesz zmienić port, edytując angular.jsonplik, który teraz określasz"project"

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

Przeczytaj więcej na ten temat here

Zwykle używam tego ng setpolecenia do zmiany ustawień Angular CLI dla poziomu projektu.

ng set defaults.serve.port=4201

Zmienia zmiany .angular.cli.jsoni dodaje ustawienia portu, jak wspomniano wcześniej .

Po tej zmianie możesz użyć po prostu ng servei będzie korzystał z preferowanego portu bez konieczności określania go za każdym razem.

możesz również wpisać poniższe polecenie w swoim kątowym pliku cli, gdzie normalnie wpisujesz npm start

ng służyć --host „adres ip” --port „numer portu”

możesz także napisać to polecenie: ng serve -p 5000

mam ten plik

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

i port wyszukiwania

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

zmień wartość domyślną i zrestartuj serwer

• Na stałe:

  Idź do nodel_modules / angular-cli / Command / server.js Wyszukaj var defaultPort = process.env.PORT || 4200; i zmień 4200 na cokolwiek chcesz.

• Aby uruchomić teraz:

  ng służyć --port 4500 (Ty zmieniasz 4500 na dowolną liczbę, której chcesz użyć jako portu)

Nie zaleca się zmiany modułów węzła, ponieważ aktualizacje lub ponowna instalacja mogą usunąć te zmiany. Więc lepiej zmienić kątowe kliknięcie

Angular 9 w angular.json

{
    "projects": {
            "targets": {
                "serve": {
                    "options": {
                         "port": 5000
                     }
                }     
            }     
    }
}  

Możesz edytować domyślny numer portu skonfigurowany w pliku serve.js.

Ścieżka będzie project_direcory/node_modules/angular-cli/commands/serve.js.

Wyszukaj tę linię -> var defaultPort = process.env.PORT || 4200;
Zamień na tę linię ->var defaultPort = process.env.PORT || 5000;

po prostu biegnij ng serve --port 5000 --open

Uruchom poniżej polecenia dla innych niż 4200

ng serve --port 4500

W angular.json:

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

Używam kątowego cli. To zadziałało dla mnie.

w kącie 2 ++.

Aby zmienić port, możesz uruchomić komendę poniżej w terminalu:

ng serve --host 0.0.0.0 --port 5000.

Chociaż w powyższych odpowiedziach jest już wiele poprawnych rozwiązań, oto wizualny przewodnik i konkretne rozwiązanie dla projektów Angular 7 (być może także wcześniejszych wersji, ale bez gwarancji) przy użyciu Visual Studio Code. Znajdź plik schema.json w katalogach, jak pokazano w drzewie obrazów, i zmień liczbę całkowitą w polu port -> default, aby trwale zmienić port w przeglądarce.

Idź do angular.jsonpliku

Wyszukaj słowo kluczowe „podaj”:

Dodaj portsłowo kluczowe, jak pokazano poniżej:

 "serve": {
     "builder": "@angular-devkit/build-angular:dev-server",
     "options": {
         "browserTarget": "my-new-angular-app:build",
         "port": 3001
     },
     ...

Istnieją dwa sposoby zmiany domyślnego numeru portu w Angular.

Pierwszy sposób na polecenie cli:

ng serve --port 2400 --open

Drugi sposób polega na konfiguracji w lokalizacji: ProjectName\node_modules\@angular-devkit\build-angular\src\dev-server\schema.json .

Wprowadź zmiany w schema.jsonpliku.

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

Po prostu biegnij

ng służyć --portuj swój port

Przykład:

ng serve --port 4401

Kod działał dla mnie następująco

ng serve --port ABCD

Na przykład

ng serve --port 6300

Aby uruchomić i otworzyć w przeglądarce, użyj flagi -openlub po prostu-o

ng serve -o --port 4200

Uwaga: Port 4200 jest dowolny. Może to być dowolny wybrany port

Jeśli chcesz użyć zmiennej środowiskowej NodeJS do skonfigurowania wartości portu serwera deweloperskiego Angular CLI, możliwe jest następujące podejście:

• utwórz skrypt NodeJS, który będzie miał dostęp do zmiennej środowiskowej (powiedzmy DEV_SERVER_PORT) i mógłby działać ng servez --portwartością parametru pobraną z tej zmiennej ( proces potomny może być naszym przyjacielem tutaj):

const child_process = require('child_process');
const child = child_process.exec(`ng serve --port=${process.env.DEV_SERVER_PORT}`);
child.stdout.on('data', data => console.log(data.toString()));

• zaktualizuj pakiet.json, aby udostępnić ten skrypt działający za pośrednictwem npm
• nie zapomnij ustawić DEV_SERVER_PORTzmiennej środowiskowej (można to zrobić za pomocą dotenv )

Oto także pełny opis tego podejścia: Jak zmienić port Angular CLI Development Server przez .env .

Spowoduje to również automatyczne otwarcie okna

ng serve -o --port 4801