Replacing the base-href in Index page Angular

Question

We have deployed one web site and under that we deployed one more app (application in IIS) in different app pools both have angular code.

In "Application" code (angular), i need to update the base href and other .ts files to /ApplicationName.

The code which is deployed in Application is used as site in other place so i want to use the different copy of the code.

So i was thinking if we have any option to dynamically update the base href -

Below is the options i thought -

• In the Dev ops pipeline, i will add the batch file which will update once the code is built in the build server,

Is it a good option ? If so, we can replace the base href in the built Angular code ?

Answer 1

No it's not.

angular.json offers a basHref property that you can control through your environments.

If you're on Angular 16+, and you don't have environments, run npx ng generate environments to get two.

You can then update your angular.json file to create a third one, and when building, you'll be able to run npx ng build -c myEnvironment. This will build the app and use the href you have provided in the environment config.