localized components containing i18n tags will produce identical chunk hashes when building with --localize

[nas90]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• xi18n
• run
• config
• help
• version
• doc

Description

I have an application that is being translated in several (21 at the moment) languages using the Angular i18n mechanism. I'm compiling the app AOT, therefore I need a separate build for each locale. To achieve this I setup my Azure pipeline to build the app using multiple agents in parallel, one for each locale, and it works like a charm. However, this is very resource-consuming, so I'm updating to Angular 9 in order to use the --localize option, which perfectly fits my needs.
After the update I can build the app once and translate it to all languages in a few seconds, which is amazing.
I am now facing this issue: when I build my application for all locales, the resulting chunk hashes are identical. As a result, browser cache is not invalidated and files are not re-requested, so the app is not translated.

🔬 Minimal Reproduction

• clone this repo
• run npm install
• run ng build --localize
• check the dist folder: file content for main.js is different for each locale (template text is translated), while the hashes are the same

🌍 Your Environment

Angular CLI: 9.1.0
Node: 10.19.0
OS: win32 x64

Angular: 9.1.0
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.901.0
@angular-devkit/build-angular     0.901.0
@angular-devkit/build-optimizer   0.901.0
@angular-devkit/build-webpack     0.901.0
@angular-devkit/core              9.1.0
@angular-devkit/schematics        9.1.0
@ngtools/webpack                  9.1.0
@schematics/angular               9.1.0
@schematics/update                0.901.0
rxjs                              6.5.5
typescript                        3.8.3
webpack                           4.42.0

Anything else relevant?
In my scenario, the user language preference is stored in the cookies, and a shell app serves the corresponding folder. I can't add the locale to the URL.
Therefore in my angular.json I set baseHref="/" for all locales.

I am aware of this issue and the PR mentioned there, however the issue is still not resolved.

[alan-agius4]

Duplicate of #16526