Which @angular/* package(s) are the source of the bug?

localize, Don't known / other

Is this a regression?

Yes

Description

Calling ng serve with a configuration that uses the "localize" option set to the sourceLocale (mine is 'de-AT'),
for example ng serve --browserTarget=my-app:build:development,locale-de-at
will lead to a false $localize error message and forces you to delete .angular cache and restart ng serve.

Worked in v13.0.3 but will only show incorrect error message during development in v13.1.0+

Please provide a link to a minimal reproduction of the bug

https://gist.github.com/reifi/a7528447fb5aca26b34097d2ef03f46f

Please provide the exception or error you saw

ERROR Error: It looks like your application or one of its dependencies is using i18n.
Angular 9 introduced a global `$localize()` function that needs to be loaded.
Please run `ng add @angular/localize` from the Angular CLI.
(For non-CLI projects, add `import '@angular/localize/init';` to your `polyfills.ts` file.
For server-side rendering applications add the import to your `main.server.ts` file.)
    localize Angular
    consts app.component.html:4
    Angular 18

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 13.1.2
Node: 16.13.0
Package Manager: npm 8.1.0
OS: win32 x64

Angular: 13.1.1
... animations, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1301.2
@angular-devkit/build-angular   13.1.2
@angular-devkit/core            13.1.2
@angular-devkit/schematics      13.1.2
@angular/cli                    13.1.2
@schematics/angular             13.1.2
rxjs                            7.4.0
typescript                      4.4.4

Anything else?

After updating to from angular v13.0.3 to v13.1.1 the $localize error appeared every time I accidentally made a mistake during development with ng serve and did not go away until I deleted the .angular directory and restarted ng serve.

I was able to reproduce it with a newly generated app I updated to v13.1.1.
https://gist.github.com/reifi/a7528447fb5aca26b34097d2ef03f46f

• Add i18n @angular/localize to newly generated app (I upgraded from 13.0.3 to 13.1.1)
  • configure i18n with localize profiles in angular.json

      "i18n": {
        "locales": {
          "it": {
            "translation": "messages.it.xlf"
          }
        },
        "sourceLocale": {
          "code": "de-AT"
        }
      },
      ...
     "configurations": {
            "locale-it": {
              "localize": [
                "it"
              ]
            },
            "locale-de-at": {
              "localize": [
                "de-AT"
              ]
            }
     },....
  

  • add some tag with i18n attribute or use this app.component.html

• Start development with ng serve --browserTarget=my-app:build:development,locale-de-at
• Change something that leads to an error in app.component.html and save it so error will be shown in browser
• Change it back and fix error -> $localize error will be shown in console and can only be fixed by deleting .angular directory.

Using ng serve --browserTarget=my-app:build:development,locale-it (using localize 'it') works, probably because it's not the sourceLocale.

Workaround:

Using ng serve --browserTarget=my-app:build:development,locale-de-at (using localize 'de-AT') does not work, but omitting the 'localize' option like ng serve --browserTarget=my-app:build:development does - although probably ignoring additional configuration like baseHref in i18n.

Found differences in cache

The cached content in .angular/cache/babel-dev-server-i18n/ will change from (for example)

... else {\n      i18n_0 = \"Unter dieser Url ist noch kein websms Partner aktiv\";\n    } 

to

... else {\n      i18n_0 = $localize`:@@view.not_found.paragraph.reseller_not_found:Unter dieser Url ist noch kein websms Partner aktiv`;

which leads to the error because "$localize" is not needed during runtime