angular: Localized bundle generation failed: Unexpected return value from helper (expected a call expression)

🐞 bug report

Affected Package

The issue is caused by package @angular/localize

Is this a regression?

the previous version in which this bug was not present was: Angular 8.x

Description

After upgrading the app to angular 9 and then 10 when I run ng build appName --configuration=production localy it works. But the issue accoures on the gitLab pipeline

🔥 Exception or Error


Localized bundle generation failed: Unexpected return value from helper (expected a call expression)

Angular Version:


Angular CLI: 10.0.6
Node: 12.14.1
OS: darwin x64

Angular: 10.0.10
... animations, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router
Ivy Workspace: <error>

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.803.15
@angular-devkit/build-angular      0.1000.6
@angular-devkit/build-optimizer    0.1000.6
@angular-devkit/build-webpack      0.1000.6
@angular-devkit/core               10.0.6
@angular-devkit/schematics         10.0.6
@angular/cdk                       8.2.3
@angular/cli                       10.0.6
@angular/flex-layout               9.0.0-beta.29
@angular/http                      7.2.16
@angular/material                  8.2.3
@angular/material-moment-adapter   8.2.3
@ngtools/webpack                   10.0.6
@schematics/angular                8.3.29
@schematics/update                 0.1000.6
rxjs                               6.6.2
typescript                         3.9.7
webpack

Anything else relevant? import in pollyfills.ts:/* Load $localize onto the global scope - used if i18n tags appear in Angular templates.*/ import ‘@angular/localize/init’; and package.json: “@angular/localize”: “^10.0.10”, But in other hand, I’ am still not using $localize in typescript and in HTML to implement the new i18n translation. I still keep the previous implementation for i18n translation. Using $localize will be the next step after getting rid of the this issue/error.

About this issue

Original URL
State: closed
Created 4 years ago
Comments: 35 (18 by maintainers)

Most upvoted comments

Glad you got to the bottom of it!! Thanks for working with me on this.

petebacondarwin on Aug 24, 2020

I would say that you must update those peerDependencies directly. The Angular framework peer dependencies should update themselves automatically when using ng update @angular/core since it contains information about how to do that. But if you have a library that has a peerDependency, it would be up to you to do the update manually.

petebacondarwin on Aug 24, 2020

What are preDependencies? Do you mean peerDependencies?

petebacondarwin on Aug 24, 2020

That is interesting. It is likely that the optimization is somehow changing the code to make it unparsable by the the i18n message translator. It is really hard for me to help without further information. Perhaps you could try removing parts of the application (and removing libraries) until you get it to work, then we might be able to nail down what is causing the problem.

petebacondarwin on Aug 21, 2020

I’ll give it a try, but I think should be: node node_modules/.bin/ngc -p src/tsconfig.app.json And yes. It’s there in couple of .JS files generated from .TS files:

var I18N_0;
if (typeof ngI18nClosureMode !== "undefined" && ngI18nClosureMode) {
    var MSG_EXTERNAL_HierarchyAddNewAdminBtn$$____________USERS_MYNAME_PROJECTFOLDER_MY_APP_SRC_APP_ADMINISTRATION_CREATE_ADMIN_CREATE_ADMIN_COMPONENT_TS_1 = goog.getMsg("New administrator");
    I18N_0 = MSG_EXTERNAL_HierarchyAddNewAdminBtn$$____________USERS_MYNAME_PROJECTFOLDER_MY_APP_SRC_APP_ADMINISTRATION_CREATE_ADMIN_CREATE_ADMIN_COMPONENT_TS_1;
}
else {
    I18N_0 = $localize(i6.__makeTemplateObject([":@@HierarchyAddNewAdminBtn\u241F18c7f81e3d470adbc7edf8e013611ba6ec8178e0\u241F7650794535022836796:New administrator"], [":@@HierarchyAddNewAdminBtn\u241F18c7f81e3d470adbc7edf8e013611ba6ec8178e0\u241F7650794535022836796:New administrator"]));
}
var I18N_2;
if (typeof ngI18nClosureMode !== "undefined" && ngI18nClosureMode) {
    var MSG_EXTERNAL_BackToOverviewLink$$____________USERS_MYNAME_PROJECTFOLDER_MY_APP_SRC_APP_ADMINISTRATION_CREATE_ADMIN_CREATE_ADMIN_COMPONENT_TS_3 = goog.getMsg(" Back to Overview ");
    I18N_2 = MSG_EXTERNAL_BackToOverviewLink$$____________USERS_MYNAME_PROJECTFOLDER_MY_APP_SRC_APP_ADMINISTRATION_CREATE_ADMIN_CREATE_ADMIN_COMPONENT_TS_3;
}
else {
    I18N_2 = $localize(i6.__makeTemplateObject([":@@BackToOverviewLink\u241F2c5f986d36e3d6c5aa6a1b9ee299c0298c03c766\u241F2292365178549247101: Back to Overview "], [":@@BackToOverviewLink\u241F2c5f986d36e3d6c5aa6a1b9ee299c0298c03c766\u241F2292365178549247101: Back to Overview "]));
}

bobKasbi on Aug 21, 2020

OK, great. Let me take a look at that. I wonder why these are in vendor.js rather than main.js??

petebacondarwin on Aug 20, 2020

Correction: There is no main.es5.js generated. I do get just a file: main.js, but there I don’t find any $localize. A $localize call existst just in vendor.js:

ctx.print(ast, '$localize((this&&this.__makeTemplateObject||function(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e})(');
      var parts = [ast.serializeI18nHead()];

      for (var i = 1; i < ast.messageParts.length; i++) {
        parts.push(ast.serializeI18nTemplatePart(i));
      }

(Pete: I updated this post to use backticks for the code block to make it more readable)

bobKasbi on Aug 20, 2020