deploy - base href angular 2 production

Establecer base href desde una variable de entorno con ng build

Question

¿Alguien sabe cómo lograr esto con el ángulo-cli? Me gustaría poder almacenar la ruta baseHref en una variable de entorno dentro de /src/environments/environment.x.ts y, en función del entorno seleccionado durante la compilación, poder establecer la ruta baseHref.

Algo como esto:

medio ambiente.ts

export const environment = {
  production: false,
  baseHref: ''/''
};

medio ambiente.prod.ts

export const environment = {
  production: true,
  baseHref: ''/my-app/''
};

Y luego llamar ...

ng build --prod

... y que mi archivo /dist/index.html muestre <base href="/my-app/"> .

Pensé que tal vez si nombraba mi variable de entorno de la misma forma que la opción de compilación --base-href utilizada en el comando de compilación para que la cli la recoja, pero tampoco hay dados allí.

¿Hay alguna forma de hacer referencia a una variable de entorno desde la línea de comandos? Algo como ng build --base-href environment.baseHref ?

Answer 1

Tendrías que usar APP_BASE_HREF

@NgModule({
  providers: [{provide: APP_BASE_HREF, useValue: environment.baseHref }]
})
class AppModule {}

Ver documento angular

EDITAR

Como CSS / JS no funciona con APP_BASE_HREF, puedes hacer esto:

En app.component.ts , inyecte DOCUMENTO a través de la import {DOCUMENT} from "@angular/platform-browser";

constructor(@Inject(DOCUMENT) private document) {
}

Entonces en su ngOnInit()

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

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

    }
  }