Javascript Polyfill支持角形9自定义元素？

Angular建议如何为使用Angular构建的自定义元素提供Polyfilling支持

仅将此polyfill添加到

polyfills.ts

：

import '@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js'

import "@webcomponents/custom-elements/src/native-shim";
import "@webcomponents/custom-elements/custom-elements.min";

说明我们应该在

polyfills.ts

中包含以下内容：

import '@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js'

import "@webcomponents/custom-elements/src/native-shim";
import "@webcomponents/custom-elements/custom-elements.min";

说我们应该将以下内容添加到

index.html

：

<script src="webcomponents/webcomponents-loader.js"></script>
<script>
  if (!window.customElements){document.write('<!--');}
</script>
<script src="webcomponents/custom-elements-es5-adapter.js"></script>
<!-- ! DO NOT REMOVE THIS COMMENT, WE NEED ITS CLOSING MARKER -->

如果（！window.customElements）{document.write（'

---

因此存在差异。在部署使用Angular构建的自定义元素时，Angular 9项目的正确方法是什么？

这完全取决于您希望支持的浏览器和应用程序生成的绑定语法

@webcomponents/custom elements/src/native shim

和

@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js

具有相同的用途，如果浏览器不支持ES2015模块，或者因为应用程序被明确配置为仅生成es5捆绑包，则使用它们

@webcomponents/custom elements

和

@webcomponents/custom elements/src/native shim

也具有相同的用途，即为本机不支持自定义元素的浏览器提供自定义元素支持

更多关于这些多边形填充的信息以及需要它们的原因和时间

我不建议使用下面的模式

<script src="webcomponents/webcomponents-loader.js"></script>
<script>
 if (!window.customElements){document.write('<!--');}
</script>
<script src="webcomponents/custom-elements-es5-adapter.js"></script>
<!-- ! DO NOT REMOVE THIS COMMENT, WE NEED ITS CLOSING MARKER -->

如果（！window.customElements）{document.write（'

一个更好的选择是

<script src="webcomponents/webcomponents-loader.js"></script>
<script nomodule src="webcomponents/custom-elements-es5-adapter.js"></script>