Angular-CLI 1.2.0 生成在 Android Webview（在某些设备上）失败的代码，但 angular-cli beta.25 不会

Question

我已经花了几天时间追踪一个问题并将其分解为可重现的问题，但我不了解在没有帮助的情况下取得进一步进展的基础技术。详细问题在本post.

底部

设置

我使用两个不同版本的 angular-cli 生成了两个空的 Angular 应用程序。我运行这两个应用程序在各种配置中 (1) 本机在 (a) 台式机、(b) 平板电脑和 (c) 机顶盒的浏览器中。我还在 (b) Android 平板电脑和 (c) 机顶盒上的 Android 应用程序的 WebView 中运行它们 (2)。

结果

CLI-BETA：由angular-cli 1.0.0-beta.25.5 生成的代码
- 浏览器（所有平台：案例 1a、1b、1c）：OK
- Android 平板电脑上的 WebApp（案例 2b）：正常
- Android 机顶盒上的 WebApp（案例 2c）：正常
CLI-LATEST：@angular/cli@1.2.0 生成的代码
- 浏览器（所有平台）：OK
- Android 平板电脑上的 WebApp：正常
- Android 机顶盒上的 WebApp：失败！！

预期结果

机顶盒上的 WebApp（案例 2c:) 应该运行 CLI-LATEST 以及（如果不优于）CLI-BETA。

重现步骤

使用两个版本的 Angular-CLI

构建两个版本的默认 Angular 应用程序

$ npm uninstall -g angular-cli @angular/cli
$ npm install -g angular-cli@1.0.0-beta.25.5
$ ng --version 
...
angular-cli: 1.0.0-beta.25.5
node: 6.11.0
os: darwin x64
$ ng new cli-beta
$ cd cli-beta
$ npm install && ng build
$ cd ..
$ npm uninstall -g angular-cli
$ npm install -g @angular/cli@1.2.0
$ ng --version
...
@angular/cli: 1.2.0
node: 6.11.0
os: darwin x64
$ ng new cli-latest
$ cd cli-latest
$ npm install && ng build
$ cd ..

运行 ng serve 在任一目录中验证它运行s 在浏览器中。（较新的版本显示 Angular 标志）。
将这两个应用程序托管在 Web 上的某个位置，以便 Android 应用程序可以将它们加载到 WebView 上。
获取 Android App with a WebView
运行平板电脑上的应用程序（我使用的是三星 SM-T580）
运行在机顶盒上（我用的是 Nexbox A95X）
- Android 6.0.1，铬 44，
- 我后来升级到 Chromium 59（又名 AndroidSystemWebview），但没有用。

具体错误

使用logcat，我只看到了。

chromium: [INFO:CONSOLE(5706)] "Uncaught TypeError: Cannot read property 'apply' of undefined", source: http://some.web.host.com/vendor.bundle.js (5706)

这是生成代码中的相关行

5705: function combine(options) {
5706:     return ((Object)).assign.apply(((Object)), [{}].concat(options));
5707: }

所以我可以 polyfill Object.assign 并且它使那个特定的错误消失了，但感觉就像 "kicking the can downhill" 而不是真正解决问题。此外，CLI-BETA 对组合函数的定义几乎相同。

我无法回答的问题

为什么 Object.assign 在这种情况下似乎需要一个 polyfill？
如果 Angular-CLI-1.2 代码运行s 在设备上的 Chrome 浏览器上，它不应该运行在 WebView activity? （两者都升级到最新版本的 Chromium 59.x.x.x）

如果我为 Object.assign 提供 polyfill，那么我会收到关于 Array.from 的错误。我也可以填充它，然后我得到

 chromium: [INFO:CONSOLE(37194)] "Uncaught Error: No provider for PlatformRef!", source: http://some.web.host.com/vendor.bundle.js (37194)

（PlatformRef 似乎是用于基本 Angular 服务的简单 JS object/singleton。）由于这不是系统对象，因此我认为不存在 [=115= 的 polyfill 这样的东西] 这个问题对吧？

这根本与 CLI 无关，而只是某些基础事物发生变化的征兆？可能是不同版本的 TypeScript（~2.0.3 vs ~2.3.3）？

Answer 1

我们可以看到，问题是你的WebView不支持Object.assign功能。对 Object.assign 函数的支持来自版本 45 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

Angular只支持最新版本的浏览器https://angular.io/guide/browser-support

我在 cordova 应用程序中遇到了类似的问题。我以某种方式在我的 phone 上安装了几个不同版本（39 和 61）的 Android System WebView 应用程序。对于 cordova 应用程序，它使用旧版本的 WebView 39，尽管有更新的版本。我在生成的代码 function combine (options) ... 和 Object.assign 代码中得到相同相关行的错误 "Uncaught TypeError: undefined is not a function"。

因此，请确保您没有安装其他版本的 WebView，并且您使用的是版本 59。

Answer 2

问题是 webview 版本，我试图从模拟器使用 webview 但被拒绝了，当我使用真实设备时我工作得很好。在做了一些研究后，我发现 WebView 系统是问题所在

Angular-CLI 1.2.0 生成在 Android Webview（在某些设备上）失败的代码，但 angular-cli beta.25 不会

Angular-CLI 1.2.0 generates code that fails in Android Webview (on certain devices) but angular-cli beta.25 doesn't

chromium

android-webview

typescript

angular-cli

设置

结果

预期结果

重现步骤

具体错误

我无法回答的问题