Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

i18n IVY - Next.12 LocaleID not set #15896

Closed
spock123 opened this issue Oct 21, 2019 · 21 comments · Fixed by #15884
Closed

i18n IVY - Next.12 LocaleID not set #15896

spock123 opened this issue Oct 21, 2019 · 21 comments · Fixed by #15884

Comments

@spock123
Copy link

🐞 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
Copy link
Author

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

@petebacondarwin
Copy link
Contributor

@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
Copy link
Author

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

@spock123
Copy link
Author

@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
Copy link
Author

spock123 commented Oct 21, 2019

@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
Copy link
Author

@petebacondarwin

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

@AndrewKushnir AndrewKushnir transferred this issue from angular/angular Oct 21, 2019
@AndrewKushnir
Copy link

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

@petebacondarwin
Copy link
Contributor

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

petebacondarwin added a commit to petebacondarwin/angular that referenced this issue Oct 22, 2019
The ivy compile time inlining tools work on the code after it has
been compiled and bundled (potentially minified and mangled).
It is only at this point in the processing that the current locale
can be specified.

The cleanest way for the tooling to provide this locale value is
by setting a well-known global property (e.g. `ɵNG_LOCALE_ID`)
which is then read at runtime by Angular and provided as the `LOCALE_ID`
token and also passed to the ivy machinery via `setLocaleId()`.

// FW-1639

See angular/angular-cli#15896
@clydin clydin reopened this Oct 22, 2019
petebacondarwin added a commit to petebacondarwin/angular that referenced this issue Oct 23, 2019
In the post-$localize world the current locale value is defined by setting
`$localize.locale` which is then read at runtime by Angular in the provider
for the `LOCALE_ID` token and also passed to the ivy machinery via`setLocaleId()`.

The $localize compile-time inlining tooling can replace occurrences of
`$localize.locale` with a string literal, similar to how translations
are inlined.

// FW-1639

See angular/angular-cli#15896
petebacondarwin added a commit to petebacondarwin/angular that referenced this issue Oct 23, 2019
In the post-$localize world the current locale value is defined by setting
`$localize.locale` which is then read at runtime by Angular in the provider
for the `LOCALE_ID` token and also passed to the ivy machinery via`setLocaleId()`.

The $localize compile-time inlining tooling can replace occurrences of
`$localize.locale` with a string literal, similar to how translations
are inlined.

// FW-1639

See angular/angular-cli#15896
petebacondarwin added a commit to petebacondarwin/angular that referenced this issue Oct 23, 2019
In the post-$localize world the current locale value is defined by setting
`$localize.locale` which is then read at runtime by Angular in the provider
for the `LOCALE_ID` token and also passed to the ivy machinery via`setLocaleId()`.

The $localize compile-time inlining tooling can replace occurrences of
`$localize.locale` with a string literal, similar to how translations
are inlined.

// FW-1639

See angular/angular-cli#15896
petebacondarwin added a commit to petebacondarwin/angular that referenced this issue Oct 23, 2019
In the post-$localize world the current locale value is defined by setting
`$localize.locale` which is then read at runtime by Angular in the provider
for the `LOCALE_ID` token and also passed to the ivy machinery via`setLocaleId()`.

The $localize compile-time inlining tooling can replace occurrences of
`$localize.locale` with a string literal, similar to how translations
are inlined.

// FW-1639

See angular/angular-cli#15896
petebacondarwin added a commit to petebacondarwin/angular that referenced this issue Oct 24, 2019
In the post-$localize world the current locale value is defined by setting
`$localize.locale` which is then read at runtime by Angular in the provider
for the `LOCALE_ID` token and also passed to the ivy machinery via`setLocaleId()`.

The $localize compile-time inlining tooling can replace occurrences of
`$localize.locale` with a string literal, similar to how translations
are inlined.

// FW-1639

See angular/angular-cli#15896
@spock123
Copy link
Author

@petebacondarwin issue still present in next.13

@clydin
Copy link
Member

clydin commented Oct 24, 2019

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

@spock123
Copy link
Author

@clydin thanks ..

AndrewKushnir pushed a commit to angular/angular that referenced this issue Oct 24, 2019
In the post-$localize world the current locale value is defined by setting
`$localize.locale` which is then read at runtime by Angular in the provider
for the `LOCALE_ID` token and also passed to the ivy machinery via`setLocaleId()`.

The $localize compile-time inlining tooling can replace occurrences of
`$localize.locale` with a string literal, similar to how translations
are inlined.

// FW-1639

See angular/angular-cli#15896

PR Close #33314
@vikerman
Copy link
Contributor

This is fixed in the latest .next build.

@spock123
Copy link
Author

@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 vikerman reopened this Oct 31, 2019
@vikerman
Copy link
Contributor

Can you share a repro? Thanks

@spock123
Copy link
Author

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

@spock123
Copy link
Author

@clydin
Copy link
Member

clydin commented Nov 1, 2019

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
Copy link
Author

spock123 commented Nov 1, 2019

@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
Copy link

fetis commented Nov 8, 2019

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
Copy link
Member

clydin commented Nov 25, 2019

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.

@clydin clydin closed this as completed Nov 25, 2019
@angular-automatic-lock-bot
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Dec 26, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

7 participants