Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add/set environment Angular 6 angular.json file

How do I specify the environment to use in Angular 6+? The .angular-cli.json file seems to have changed to angular.json from previous versions and with it the structure of the json within.

How/where in this file do I specify the environments to use?

like image 507
Danoram Avatar asked May 13 '18 06:05

Danoram


People also ask

Where is config json in Angular?

You can have the JSON file somewhere in assets folder like: assets/config . Depending on whether the environment is dev or not you can use two . json files, one for development and one for production.

Can I edit Angular json?

JSON Editor is a web-based tool to view, edit, format, and validate JSON. It has various modes such as a tree editor, a code editor, and a plain text editor. The editor can be used as a component in your own web application. The library can be loaded as a CommonJS module, AMD module, or as a regular javascript file.

Where is Angular JSON file located?

The angular-cli. json should be located in the root folder of the project. This is using the latest version "@angular/cli": "1.0. 0-beta.


1 Answers

Open angular.json file. we can see the configurations by default it will be shown for production add code snippet for your respective environments. add environment.dev.ts file in environment for dev, add environment.qa.ts for qa. Name as you prefered. use

 ng serve --configuration=environment_name 

environment_name - (dev,qa,prod) same process can be followed for 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         }       } 
like image 88
rawoof ahamed Avatar answered Sep 28 '22 04:09

rawoof ahamed