Change angular base href when ng build --prod --localize

Question

The situation

I have created an Angular App with Internationalization (i18n). I want to host the different versions in subdomains like:

• en.myexample.com
• es.myexample.com

The problem

When I use the command ng build --prod --localize the tag base href in src/app/index.hml the has the language added, like:

• <base href="/en/">
• <base href="/es/">

What I want

Generate each version with <base href="/">

Answer 1

You can configure the base href for each locale in your angular.json file.

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "projects": {
    "my-app": {
      "projectType": "application",
      "...",
      "i18n": {
        "sourceLocale": {"code": "en-US", "baseHref": ""},
        "locales": {
          "de": {"translation": "", "baseHref": ""},
          "de-CH": {"translation": "", "baseHref": ""},
          "en-GB": {"translation": "", "baseHref": ""},
          "fr-FR": {"translation": "", "baseHref": ""},
        }
      },

See https://angular.io/guide/i18n#localize-config and https://github.com/angular/angular-cli/blob/b90c04db16b9dba85bc7689f205f4e0e4217d772/packages/angular/cli/lib/config/schema.json#L429-L432 for more info.