web-dev-qa-db-fra.com

Comment définir l'environnement via `ng serve` dans Angular 6

J'essaie de mettre à jour mon application Angular 5.2 vers Angular 6. J'ai bien suivi les instructions du guide de mise à jour angulaire (y compris la mise à jour de angular-cli à v6) et j'essaie maintenant de servir l'application via

ng serve --env=local

Mais cela me donne une erreur:

Option inconnue: '--env'

J'utilise plusieurs environnements (dev/local/prod), et c'est ainsi que cela fonctionnait dans Angular 5.2. Comment définir l'environnement maintenant dans Angular 6?

angularangular6angular-cli
92
Martin Adámek

Vous devez utiliser la nouvelle option configuration (cela fonctionne aussi pour ng build et ng serve)

ng serve --configuration=local

ou

ng serve -c local

Si vous examinez votre fichier angular.json, vous constaterez que vous avez un contrôle plus précis des paramètres de chaque configuration (par exemple, optimiseur, fichiers d’environnement, ...).

"configurations": {
  "production": {
    "optimization": true,
    "outputHashing": "all",
    "sourceMap": false,
    "extractCss": true,
    "namedChunks": false,
    "aot": true,
    "extractLicenses": true,
    "vendorChunk": false,
    "buildOptimizer": true,
    "fileReplacements": [
      {
        "replace": "src/environments/environment.ts",
        "with": "src/environments/environment.prod.ts"
      }
    ]
  }
}

Vous pouvez obtenir plus d'informations ici pour gérer des configurations spécifiques à l'environnement. 

Comme indiqué dans l'autre réponse ci-dessous, si vous devez ajouter un nouvel "environnement", vous devez ajouter une nouvelle configuration à la tâche build et, en fonction de vos besoins, au serve et au test tâches également.

Ajout d'un nouvel environnement

Edit: Pour que tout soit clair, les remplacements de fichier doivent être spécifiés dans la section build. Donc, si vous voulez utiliser ng serve avec un fichier environment spécifique (par exemple, dev2), vous devez d'abord modifier la section build pour ajouter une nouvelle configuration dev2 

"build": {
   "configurations": {
        "dev2": {

          "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.dev2.ts"
            }
            /* You can add all other options here, such as aot, optimization, ... */
          ],
          "serviceWorker": true
        },

Modifiez ensuite votre section serve pour ajouter également une nouvelle configuration, en pointant sur la configuration dev2build que vous venez de déclarer.

"serve":
      "configurations": {
        "dev2": {
          "browserTarget": "projectName:build:dev2"
        }

Ensuite, vous pouvez utiliser ng serve -c dev2, qui utilisera le fichier de configuration dev2

157
David

La https://stackoverflow.com/a/50174679/1484847 answer semble bonne . Cependant, elle me conduit à une erreur car elle a entraîné une erreur Configuration 'xyz' could not be found in project ... dans la construction. Il est nécessaire non seulement de mettre à jour les configurations build, mais également serve les uns.

Donc, juste pour ne pas confondre:

  1. --env n'est pas pris en charge dans angular 6
  2. --env est devenu --configuration || -c (et est maintenant plus puissant)
  3. pour gérer divers envs, en plus d'ajouter un nouveau fichier d'environnement, il est maintenant nécessaire de faire quelques changements dans le fichier angular.json:
    • ajouter une nouvelle configuration dans la propriété build{ ... "build": "configurations": ...
    • new configuration de construction _ peut contenir uniquement une partie fileReplacements (mais davantage d'options sont disponibles)
    • ajouter une nouvelle configuration dans la propriété serve{ ... "serve": "configurations": ...
    • new serve configuration doit contenir de browserTarget="your-project-name:build:staging" 
31
garfunkel61

Vous pouvez essayer: ng serve --configuration=dev/prod

Pour construire, utilisez: ng build --prod --configuration=dev

J'espère que vous utilisez un environnement différent.

3
amku91

Pour Angular 2 - 5, reportez-vous à l'article Multiple Environment in angular

Pour Angular 6, utilisez ng serve --configuration=dev

Remarque: reportez-vous au même article pour l'angle 6 également. Mais partout où vous trouvez --env, utilisez plutôt --configuration. Cela fonctionne bien pour 6 angulaire.

2
Prasanth Venkatesan

Angular ne prend plus en charge --env mais vous devez utiliser

ng serve --c dev

pour l'environnement de développement et,

ng serve --c prod

pour la production. J'espère que cela t'aides.

0
Shilpa Soni

Utilisez cette commande pour Angular 6 afin de construire

ng build --prod --configuration=dev
0
Sateesh

Vous pouvez utiliser la commande ng serve -c dev pour l’environnement de développement ng serve -c prod pour l'environnement de production

lors de la construction, il en va de même. Vous pouvez utiliser ng build -c dev pour dev build

0
Shridhar Acharya