Using the AoT Compiler

To Internationalize with the AoT (Ahead of time) compiler, you will have to:
  • pre-build a separate application package for each language
  • determine which language the user needs
  • serve the appropriate application package
Refer to the AoT docs for more details on AoT.
Once your ready, you can setup a configuration per locale to translate - for French it could look like this:
"build": {
...
"configurations": {
...
"fr": {
"aot": true,
"outputPath": "dist/my-project-fr/",
"i18nFile": "src/locale/messages.fr.xlf",
"i18nFormat": "xlf",
"i18nLocale": "fr",
"i18nMissingTranslation": "error",
...
}
}
},
"serve": {
...
"configurations": {
...
"fr": {
"browserTarget": "*project-name*:build:fr"
}
}
}
Alternatively you can use the following 3 options with the ng build compile command:
  • --i18nFile: the path to the translation file
  • --i18nLocale: the id of the locale
  • --i18nFormat: the format of the localization file
For example, the French language config above the command would look something like this:
./node_modules/.bin/ng build --i18nFile=./locale/messages.fr.xlf --i18nLocale=fr --i18nFormat=xlf --i18nMissingTranslation=error
Additionally there is a --i18nMissingTranslation flag that controls how to handle missing translations, this is particular useful for a CI step, to ensure all strings of a new feature have been translated.