web-dev-qa-db-fra.com

Comment ajouter/définir l'environnement Angular 6 angular.json

Comment spécifier l'environnement à utiliser dans Angular 6? Le fichier .angular-cli.json semble avoir changé pour angular.json par rapport aux versions précédentes et avec lui la structure de la json à l'intérieur.

Comment/où dans ce fichier puis-je spécifier les environnements à utiliser?

angularangular6
27
Danoram

Ouvrez le fichier angular.json. nous pouvons voir les configurations par défaut, il sera affiché pour la production ajouter un extrait de code pour vos environnements respectifs. ajoutez le fichier environment.dev.ts dans environment for dev, ajoutez environment.qa.ts for qa. Nommez comme vous préférez . Use

 ng serve --configuration=environment_name

nom_environnement - (dev, qa, prod) le même processus peut être suivi pour ng build

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

J'ai essayé la réponse pour ajouter une nouvelle configuration 'test' dans mon application Angular 6, puis couru 

ng serve --configuration=test

Et obtenu une erreur en disant 'Configuration' test 'n'a pas pu être trouvé dans le projet'. Regardez dans le fichier angular.json et il y a une autre section sous "build" qui s'appelle "serve". La nouvelle configuration doit être ajoutée à la section de configuration sous "servir" également pour que ng serve pour l'utiliser:

"serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": {
        "browserTarget": "my-app:build"
      },
      "configurations": {
        "production": {
          "browserTarget": "my-app:build:production"
        },
        "test": {
          "browserTarget": "my-app:build:test"
        }
      }
    },
12
wctiger

Il existe une propriété dans angular.json pour spécifier le fichier à utiliser dans dev et prod et, comme d'habitude, vous importez environment.ts dans votre projet pour obtenir ce dont vous avez besoin.

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