Translation not recognized on production (webpack, JIT)

I’m submitting a … (check one with “x”)

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior I am using the “official” angular i18n to provide translations for my app. I am loading the specific xlf file from the backend (Promise) and hand it over to bootstrapModule() in the main.ts file.

Everything works fine as long as my app isn’t in production mode, as soon as I switch to it, it seems like the translations aren’t recognized anymore (even though no error messages are thrown).

Dev: http://prntscr.com/f0ylzi Production: http://prntscr.com/f0ym9j

The xlf file is requested and loaded correctly in both cases from the specific backend (http://prntscr.com/f0yn5w)

Expected behavior The translations should be recognized.

Minimal reproduction of the problem with instructions

main.ts: https://pastebin.com/nRSbJtdH i18n-provider.ts: https://pastebin.com/2rH8Teb3

1. Create a new empty project via angular-cli
2. Add a translation provider which loads the xlf file from the server
3. Add the provider to your main.ts
4. Add some translations to the template and create a xlf file
5. Switch between production and development environment

What is the motivation / use case for changing the behavior?

Well ehm, it should work I think? 😃

Please tell us about your environment:

Dev Environment: W10 x64, PHPStorm 2016.3.2, NPM, ng-serve integrated HTTP Server Prod Environment: Debian 8 x64, NPM, nginx

• Angular version: 4.0.3

• Browser: [Chrome XX | Firefox XX]

• Language: [TypeScript 2.3]

• Node (for AoT issues): node --version = 7.4.0 (JIT)

[jakob-bebop]

I have the same problem with @angular/core@4.1.0.

The broblem is also reproducable by running ng s -t production -e dev, meaning that:

• the build is production (lazy-loaded code in seperate bundles)
• the environment is dev (app prints “Angular is running in the development mode” etc. in console)
• the translation file xlf still downloads, but it doesnt get loaded in the UI.

debug attempt: I used this provider object at bootstrap (re the example at https://angular.io/docs/ts/latest/cookbook/i18n.html#!#jit )

{
        provide: TRANSLATIONS,
        useFactory: () => {
          console.log("Providing translations", translations.substring(0,50));
          return translations
        }
}

and the factory method is not called (which otoh it does if I run the development build)

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}