Angular-cli: i18n IVY - Next.12 LocaleID not set

[spock123]

🐞 bug report

Description

Setting locale in angular.json is ignored by the compiler.
No matter the locale, injecting the localeID token gives "en-US" .

🔬 Minimal Reproduction

Set locale in angular.json

              "i18nFile": "src/locale/messages.sv.xlf",
              "i18nFormat": "xlf",
              "i18nLocale": "sv",
              "baseHref": "/sv/"

Serve the app, inject localeID token and print it out, gives "en-US"

🌍 Your Environment

Angular Version:

Angular CLI: 9.0.0-next.12
Node: 12.2.0
OS: darwin x64
Angular: 9.0.0-next.12
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router, service-worker

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.900.0-next.12
@angular-devkit/build-angular      0.900.0-next.12
@angular-devkit/build-optimizer    0.900.0-next.12
@angular-devkit/build-webpack      0.900.0-next.12
@angular-devkit/core               9.0.0-next.12
@angular-devkit/schematics         9.0.0-next.12
@angular/cdk                       9.0.0-next.0
@angular/material                  9.0.0-next.0
@angular/material-moment-adapter   9.0.0-next.0
@angular/pwa                       0.900.0-next.12
@ngtools/webpack                   9.0.0-next.12
@schematics/angular                9.0.0-next.12
@schematics/update                 0.900.0-next.12
rxjs                               7.0.0-alpha.0
typescript                         3.6.4

[spock123]

Fwiw issue also present in next-11, next-10

[petebacondarwin]

@spock123 did this ever work in previous version of Angular (e.g. v7?)
The reason I ask is that as far as I can tell, the LOCALE_ID must be provided programmatically - e.g. by adding something like providers: [ { provide: LOCALE_ID, useValue: 'sv' } ], to your NgModule. See https://angular.io/api/core/LOCALE_ID

[spock123]

Hi @petebacondarwin yes, I'm using this in an Angular 8.x production application (non IVY).

[spock123]

@petebacondarwin

So serving, building is done like this:

npm run serve -- --configuration=sv

We support 3 languages so we run this for each language when we build the application.
Working fine in non-IVY 8.x Angular.. I haven't tried Angular 9.x Non-IVY.. will try when I can

[spock123]

@petebacondarwin
Back again, it works fine in 9-next.12 with no IVY... as soon as I add IVY support, localeID is not set.

I'm pretty sure the locale is supposed to be set in angular.json, so you can have different build configurations for i18n language versions.

Thank you for looking into this

[spock123]

@petebacondarwin

Btw I use Aot for both development and production.. maybe that makes a difference... I don't use runtime i18n

[AndrewKushnir]

Thanks for reporting this issue @spock123. I moved this issue to Angular CLI repo for further investigation. Thank you.

[petebacondarwin]

I'm not sure that this is fixed by #15884 ... should we reopen?

[spock123]

@petebacondarwin issue still present in next.13

[clydin]

This issue has not yet been corrected and is still in progress.

[spock123]

@clydin thanks ..

[vikerman]

This is fixed in the latest .next build.

[spock123]

@vikerman
The issue is still present for me.

^9.0.0-next.15

Injecting localeID gives me "en-US" when using IVY.
Without IVY it works as expected.

[vikerman]

Can you share a repro? Thanks

[spock123]

@vikerman I will try, have to strip a lot from my app.. will try later, thanks

[spock123]

@vikerman

https://github.com/spock123/ivy-locale

[clydin]

ng serve does not currently support localization with ivy.
From the reproduction, the translation files are also zero bytes which are invalid as a translation file format. Once those were corrected, a build followed by directly serving the output directory provided the correct output with the locale identifier present.

[spock123]

@clydin the translation files were only empty in this demo, they were not empty in my project.

That I could not use ng serve was the issue - thanks. I assume it will be working at some point, will lay off testing Ivy for now then.

Thanks

Just should note for people seeing this, that it's pretty important to know that localeID will be set to 'en-US' when using "ng serve", no matter the configuration. Some people might expect otherwise.

For example, many people use ngx-translate with runtime translation, and they often rely on this localeID to determine language file to download. It has nothing to do with core Angular features, but it will break those who depend on the localeID to be set.

[fetis]

ng serve does not currently support localization with ivy.

@clydin could you plz explain a bit more on it? I have next config for the serve

          "configurations": {
            "en": {
              "browserTarget": "xxx-frontend:build:testing-en"
            }
          }

where for testing-en config I have i18nLocale specified.

In my understanding result of ng serve -c=en in the browser is the same as I would make a build and serve it with some other web-server. So, I don't understand how i18nLocal can be missed.

btw, i18nLocale is an official way to setup locale for builds https://angular.io/guide/i18n#merge-with-the-aot-compiler
so, I would expect feature parity or migration guide

[clydin]

ng serve now supports single locale localization as it did previously for 8.0.
Documentation updates are also in progress and will be available for the final 9.0 release.

[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._}