Angular 应用程序 (v8) 不适用于 IE11 中的 Web 组件 polyfill答案

【问题标题】：Angular application (v8) not working with web component polyfills in IE11Angular 应用程序 (v8) 不适用于 IE11 中的 Web 组件 polyfill
【发布时间】：2019-06-09 03:03:50
【问题描述】：

我试图在 Angular (v8) 应用程序中使用 web component polyfills，但它似乎在 IE11 中不起作用。我已经创建了一个非常basic repository 会产生问题。该存储库是一个全新的 Angular 应用程序（来自运行 ng new）。我在 repo 中有关于如何使用 es5 代码快速克隆、设置 repo 和提供应用程序的说明。这样做时，您将在 IE11（版本 11.0.9600.17031）中遇到以下问题：

该错误与 Angular 生成的 polyfill-es5.js 文件有关。如果我从 index.html 页面中删除此文件，则不会发生错误（显然整个应用程序也无法正常工作）。

我不知道如何加载 web 组件 polyfill，以便它们可以在 IE11 中工作？？

添加地图文件后，问题来自 get-own-property-symbols.max.js 文件。

【问题讨论】：

标签： angular web-component lit-element

【解决方案1】：

我通过将 webcomponent polyfills 添加到 angular.json 文件而不是 index.html 文件来解决了这个问题。

"scripts": [
          "node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js",
          "node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"
        ]

我还设法使用发光元素组件设置了 Angular v8 应用程序。如果有人感兴趣，可以在这里查看repo：Angular v8 with lit elements

【讨论】：