This is just a quick tip post about using configuration in your Angular app. The framework has already provided a simple and easy approach to this, so lets try it out.
Angular projects come with 2 default environment files which I find are the perfect place to insert configuration values. They can be found in the
environments folder, one for development and one for production. The
angular.json takes care of swapping these files around depending on your build intention.
By default, the
environment.ts file looks something like this:
We can add additional variables to this object, such as:
Accessing our values
Now that we have set up our configuration we can easily access them by simply importing the environments object:
This environment object is available anywhere in Angular, so avoid hardcoding values and make use of reusability! Oh and don’t forget to modify the
environment.prod.ts file for production settings.