Ionic 4 Angular内置i18n安卓构建失效问题求助

I’ve run into nearly identical issues with Ionic + Angular’s native i18n setup before—let’s walk through the most likely fixes step by step:

1. Verify Cordova Build Configuration Binding #

First, double-check that your ionic-cordova-build target in angular.json is properly nested under the architect section (it’s easy to misplace this). Your configuration should look like this (adjusted for full context):

"architect": {
  "build": {
    // Your existing build configurations including beta:german...
  },
  "ionic-cordova-build": {
    "builder": "@ionic/angular-toolkit:cordova-build",
    "options": {
      "browserTarget": "app:build"
    },
    "configurations": {
      "beta:german": {
        "browserTarget": "app:build:beta:german"
      }
    }
  }
}

If the ionic-cordova-build entry isn’t under architect, Cordova won’t pick up your i18n settings.

2. Validate Build Command & Logs #

Run your build command with verbose logging to confirm Angular’s i18n step is executing:

ionic cordova build android --configuration=beta:german --verbose

Look for lines referencing messages.de.xlf or i18nLocale: de in the output. If you don’t see these, the configuration isn’t being applied—try explicitly specifying the browser target directly:

ionic cordova build android -- --configuration=beta:german

(The extra -- ensures the configuration flag passes through to Angular’s build process.)

3. Clear Cordova’s WWW Cache #

Ionic sometimes caches old build artifacts in the Cordova platform directory. Do a full clean:

• Delete the platforms/android/www folder
• Delete the root www folder
• Re-run your build command
  Afterward, compare the root www (from ng build --configuration=beta:german) with platforms/android/www—they should be identical. If not, the Cordova copy step is failing.

4. Ensure Locale is Registered Correctly #

Even if web builds work, Cordova’s native environment might need explicit locale registration. Update your app.module.ts:

import { NgModule, LOCALE_ID } from '@angular/core';
import { registerLocaleData } from '@angular/common';
import localeDe from '@angular/common/locales/de';
import localeDeExtra from '@angular/common/locales/extra/de';

registerLocaleData(localeDe, 'de', localeDeExtra);

@NgModule({
  // ...
  providers: [
    { provide: LOCALE_ID, useValue: 'de' } // Match your i18nLocale in angular.json
  ]
})
export class AppModule { }

This ensures Angular uses the correct locale for date/number formatting and ties into your i18n translations.

5. Check Environment File Interference #

Your environment.beta.ts file (from the file replacement) might accidentally override locale settings. Ensure there are no hardcoded language variables (like defaultLang: 'en') that could clash with your i18n setup.

6. Test with Manual WWW Replacement #

As a diagnostic step:

1. Run ng build --configuration=beta:german to generate the correct German web assets
2. Copy the entire root www folder into platforms/android/www
3. Run ionic cordova run android
   If the app shows German now, the problem is that ionic cordova build isn’t triggering the correct Angular build. Try updating @ionic/angular-toolkit to the latest version, as older versions had bugs with i18n configuration passthrough.

内容的提问来源于stack exchange，提问作者Philipp