According to multiple sources (like e.g. this one), I'm supposed to be able to switch between different environments by specifying the name in the following way.
ng serve --environment=dev
If I understand the setup correctly, my .angular-cli.json file points to the environments/environment.ts for the flag value dev and to the environments/environment.prod.ts for the prod value.
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
The issue is that when I execute the one quoted in the first example, I still get to see the prod version. (I print out the whole environment object in the constructor of the accessed component.) I even tried to add the target flag, although I'm rather certain that's only the optimization level while running build. No difference…
ng serve --environment=dev --target=development
What am I missing and how can I make the serve command run with environments/environment.ts?
edit
The contents of main.ts are as follows.
import { enableProdMode } from "@angular/core";
import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
import { AppModule } from "./app/app.module";
import { environment } from "./environments/environment";
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.log(err));
Best Answer
As of 2020, use
configurations
instead of environments.Instead of
This works for
serve
andbuild
.angular.json
should look something like this: