Search⌘ K
Home
Courses
The Angular Masterclass

The Environment Files

Explore how to create and configure Angular environment files for development, production, and additional environments like QA. Understand how to update angular.json and use CLI commands to build and serve your app with the correct environment settings, enabling multi-environment deployments and optimized builds.

We'll cover the following...

The environment settings files

Within our application, we have two environment files as standard. There’s one for development,environment.ts, and one for production, environment.prod.ts. Both of these files can be found in the /environments folder of our application. Within these files, we can add any environmental settings we want to access within our code.

Example

For example, we could set the main API URL. Then, in the development version, we have a development URL, which points to a dev server. And in the production environments file, the same URL points to the live product URL.

This is what the environment.ts file could look like with an API URL for development:

export const environment = {
    // set to false to show that not a production version
    production: false, 
       
    baseApiURL: 'https://dev.api.example.com'
};

In the following code, we have the same properties, but this time in the environment.prod.ts file:

export const environment = {
   production: true,
   baseApiURL:
...