Set base href from an environment variable with ng build

You would have to use APP_BASE_HREF

  providers: [{provide: APP_BASE_HREF, useValue: environment.baseHref }]
class AppModule {}

See angular doc


Since CSS/JS does not work with APP_BASE_HREF, you can do this:

In app.component.ts, inject DOCUMENT via import {DOCUMENT} from "@angular/platform-browser";

constructor(@Inject(DOCUMENT) private document) {

Then on your ngOnInit()

ngOnInit(): void {
    let bases = this.document.getElementsByTagName('base');

    if (bases.length > 0) {
      bases[0].setAttribute('href', environment.baseHref);


Leave a Comment