Using azure devops File Transform to deploy a same angular build to multiple environments.

For an angular application, at build time, if you pass in a configuration name, then the webpack build tool replaces the content of the environment.ts file with the content of the environment. For instance, if you run the command ng build --prod, angular replaces the content of environment.ts with that of the environment.prod.ts. Similarly, if you run ng build --staging, angular replaces environment.ts with environment.staging.ts, provided the file exists. This approach works but it requires building multiple times for different environments. In this post, I show you the approach I learn from my coworker to build one time and deploy to multiple environments, using angular APP_INITIALIZER and the File Transform task in azure devops.

You can find complete source code for this post on my github.

Continue reading