241 votes

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 suivi avec succès les instructions du guide de mise à jour Angular (y compris la mise à jour de angular-cli vers v6), et maintenant j'essaie 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 puis-je définir l'environnement maintenant dans Angular 6?

439voto

David Points 11437

Vous devez utiliser le nouveau configuration option (cela fonctionne pour ng build et ng serve ainsi)

ng serve --configuration=local

ou

ng serve -c local

Si vous regardez votre angular.json le fichier, vous verrez que vous avez plus de contrôle sur les paramètres pour chaque configuration (aot, optimizer, 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'infos ici pour la gestion de l'environnement des configurations spécifiques.

Comme indiqué dans la réponse ci-dessous, si vous avez besoin d'ajouter un nouvel "environnement", vous devez ajouter une nouvelle configuration pour le construire tâche et, en fonction de vos besoins, de le servir et de test des tâches en tant que bien.

L'ajout d'un nouvel environnement

Edit: Pour faire clair, le fichier de remplacement doivent être spécifiés dans l' build section. Donc, si vous voulez utiliser ng serve avec un environment fichier (disons dev2), vous devez d'abord modifier l' build section pour ajouter un nouveau dev2 de configuration

"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 serve section pour ajouter une nouvelle configuration ainsi, pointant vers le dev2 build configuration que vous avez déclaré

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

Ensuite, vous pouvez utiliser ng serve -c dev2, qui va utiliser le dev2 fichier de config

63voto

garfunkel61 Points 439

Cette réponse semble bon.
cependant, il me mène vers une erreur qu'il a entraîné avec
Configuration 'xyz' could not be found in project ...
erreur dans la construction.
Il est requierd non seulement à la mise à jour de construire des configurations, mais aussi de servir ceux.

Donc, pour ne laisser aucune confusion:

  1. --env n'est pas pris en charge en angular 6
  2. --env a été changé en --configuration || -c (et il est maintenant plus puissant)
  3. pour gérer les différents envs, en plus de l'ajout de nouveaux fichier d'environnement, il est maintenant nécessaire de faire quelques changements dans angular.jsonle fichier:
    • ajouter nouvelle configuration du build { ... "build": "configurations": ... de la propriété
    • nouvelle configuration de build peut contenir seulement fileReplacements partie, (mais d'autres options sont disponibles)
    • ajouter nouvelle configuration dans la servent { ... "serve": "configurations": ... de la propriété
    • nouveau servir de configuration doit contenir de l' browserTarget="your-project-name:build:staging"

12voto

amku91 Points 507

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

Pour construire l'utilisation: ng build --prod --configuration=dev

J'espère que vous utilisez un autre type d'environnement.

9voto

Pour Angular 2 - 5, référez-vous à l'article Multiple Environment in angular

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

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

2voto

Sateesh Points 655

Utilisez cette commande pour Angular 6 pour construire

 ng build --prod --configuration=dev
 

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X