web-dev-qa-db-fra.com

Définir l'hôte et le port par défaut pour servir dans le fichier de configuration

Je veux savoir si je peux définir un hôte et un port dans un fichier de configuration afin de ne pas avoir à taper

ng serve --Host foo.bar --port 80

au lieu de juste

ng serve
angularangular-cli
115
cre8

CLI angulaire 6+

Dans la dernière version de Angular, ceci est défini dans le fichier de configuration angular.json . Exemple:

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

Vous pouvez aussi utiliser ng config pour voir/éditer les valeurs:

ng config projects["my-project"].architect["serve"].options {port:4444}

CLI angulaire <6

Dans les versions précédentes, cela était défini dans angular-cli.json sous l'élément defaults:

{
  "defaults": {
    "serve": {
      "port": 4444,
      "Host": "10.1.2.3"
    }
  }
}
164
Toby J

Pour le moment, cette fonctionnalité n'est pas prise en charge. Cependant, si cela vous gêne, une alternative serait dans votre package.json ...

"scripts": {
  "start": "ng serve --Host foo.bar --port 80"
}

De cette façon, vous pouvez simplement exécuter npm start

Une autre option si vous souhaitez effectuer cette opération sur plusieurs projets consiste à créer un alias, que vous pouvez éventuellement nommer ngserve, qui exécutera votre commande ci-dessus.

61
Brocco

Vous pouvez configurer le port HTTP par défaut et celui utilisé par le serveur LiveReload à l'aide de deux options de ligne de commande:

ng serve --Host 0.0.0.0 --port 4201 --live-reload-port 49153

https://github.com/angular/angular-cli

30
Shreekant N

Cela a changé dans la dernière CLI angulaire.

Le nom du fichier a été remplacé par angular.json et la structure a également été modifiée.

Voici ce que vous devriez faire:

"projects": {
    "project-name": {
        ...
        "architect": {
            "serve": {
                "options": {
                  "Host": "foo.bar",
                  "port": 80
                }
            }
        }
        ...
    }
}
24
arsanyf

Une autre option consiste à exécuter la commande ng serve avec l'option --port, par exemple 

ng serve --port 5050 (c'est-à-dire pour le port 5050)

Sinon, la commande: ng serve --port 0, assignera automatiquement un port disponible à utiliser.

14
Mwizak

Vous pouvez les sauvegarder dans un fichier, mais vous devez le mettre dans .ember-cli (du moins pour le moment); voir https://github.com/angular/angular-cli/issues/1156#issuecomment-227412924

{
"port": 4201,
"liveReload": true,
"Host": "dev.domain.org",
"live-reload-port": 49153
}

edit: vous pouvez maintenant les définir dans angular-cli.json à partir de commit https://github.com/angular/angular-cli/commit/da255b0808dcbe2f9da62086baec98dacc4b7ec9 , qui est dans la version 1.0.0-beta.30

6
Dan Mitchell

Nous avons deux façons de changer le numéro de port par défaut dans Angular.

Première façon de cliquer sur la commande:

ng serve --port 2400 --open

La deuxième méthode consiste à configurer l'emplacement à l'emplacement suivant: ProjectName\node_modules\@ angular-devkit\build-angular\src\dev-server\schema.json.

Apportez des modifications dans le fichier schema.json.

{ "title": "Cible du serveur de développement", "description": "Options de la cible du serveur de développement pour construire une façade.", "type": "objet", "Propriétés": { "browserTarget": { "type": "chaîne", "description": "Cible à servir." }, "Port": { "type": "numéro", "description": "Port pour écouter.", "default": 2400 },

4
Satyendra Patel

Si vous êtes sur Windows, vous pouvez le faire de cette façon: 

  1. Dans le répertoire racine de votre projet, créez le fichier run.bat
  2. Ajoutez votre commande avec votre choix de configurations dans ce fichier. Par exemple

ng serve --Host 192.168.1.2 --open

  1. Vous pouvez maintenant cliquer sur ce fichier et l'ouvrir à chaque fois que vous souhaitez le servir.

Ce n'est pas une manière standard mais confortable à utiliser (ce que je ressens).

2
Sankeerth

voici ce que je mets dans package.json (en cours d'exécution angulaire 6):

{
  "name": "local-weather-app",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --port 5000",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },

Ensuite, un simple démarrage de npm affichera le contenu de start. Pourrait aussi ajouter d'autres options au contenu

0
John Dugger

entrez la description de l'image ici

Une seule chose à faire. Tapez ceci dans votre invite de commande: Ng serve --port 4021 [ou tout autre port que vous souhaitez affecter, par exemple: 5050, 5051, etc.]. Pas besoin de faire des changements dans les fichiers. 

0
Shahbaz Ali Khan