Deploy URL Deprecated. How do I configure the alternative?

Question

In Angular 13 when I build my application, I recieve the following warning:

Option "deployUrl" is deprecated: Use "baseHref" option, "APP_BASE_HREF" DI token or a combination of both instead. For more information, see https://angular.io/guide/deployment#the-deploy-url.

I have read the documentation page but I am struggling to wrap my head around it.

This occurs because in my angular.json I have multiple builds, but this only applies to the production configuration:

...
    deployURL: "https://cdn.lol.com/prod/app"
...

What would I need to do to achieve the same outcome as deployURL?

I considered creating an environment.production.ts file with a baseHref property and then I could use a provider in my app module. (See APP_BASE_HREF Docs) but assuming I do that, I don't really understand where I would use the Token correctly. I also don't really understand what my new relationship would be with assets.

As far as I understand, deployURL was specifically for routes, whereas baseHref effects both routes and assets (or can?). This seems to open a can of worms.

I would appreciate any insight!

Thanks.

Answer 1

In app.module.ts, you can use it like below given SS to update the deploy url.