web-dev-qa-db-fra.com

Définir le href de base à partir d'une variable d'environnement avec ng build

Est-ce que quelqu'un sait comment accomplir cela avec l'angular-cli? Je voudrais pouvoir stocker le chemin baseHref dans une variable d'environnement dans /src/environments/environment.x.ts et en fonction de l'environnement sélectionné lors de la construction, pouvoir définir le chemin d'accès baseHref.

Quelque chose comme ça:

environment.ts

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

environment.prod.ts

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

Et puis appelez ...

ng build --prod

... et ai mon /dist/index.html show file <base href="/my-app/">.

Je pensais que si je nommais ma variable d'environnement de la même manière que --base-href option de build utilisée dans la commande build pour que le cli puisse la récupérer, mais pas de dés non plus.

Existe-t-il un moyen de référencer une variable d'environnement à partir de la ligne de commande? Quelque chose comme ng build --base-href environment.baseHref?

angularangular-cli
26
ryanulit

Vous devez utiliser APP_BASE_HREF

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

Voir doc angulaire

[~ # ~] modifier [~ # ~]

Étant donné que CSS/JS ne fonctionne pas avec APP_BASE_HREF, vous pouvez le faire:

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

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

Puis sur votre ngOnInit()

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

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

    }
  }
18
penleychan