IE 11 中的 WebComponents 支持 - PolyFills

Question

我有一个网络组件在 chrome 中运行。我正在尝试让它显示在 IE 11 中。

我在主索引页中添加了这一行：

<script type="text/javascript" src="app/shared/headerComponent/webcomponents-lite.js"></script>

我已将文件复制到所述目录。在我重建和部署我的网站后，我在 IE 中看不到 Web 组件，在 Chrome 中它显示正常。

我是不是漏掉了什么？

2017 年 9 月 6 日更新

我现在收到这个错误：

文件：webcomponents-lite.js，行：137，列：460 无法获取属性 'documentElement' 的未定义或空引用

线路是这样的：

var a=this.ownerDocument;if(a&&a.contains&&a.contains(this)||(a=a.documentElement)&&

因此，看起来 polyfill 正在加载但未正确执行。另外，我在连接和断开连接的回调中加入了一些 console.log，但它们也没有被调用。

Answer 1

我添加了这些 polyfill/库：

<script type="text/javascript" src="app/shared/headerComponent/webcomponents-lite.js"></script>
<script type="text/javascript" src="app/shared/headerComponent/custom-elements.min.js"></script>

此外，位置也会有所不同。我把它们放在 head 标签之后。在 body 无法正常工作后，需要进行 DOM 操作。

我添加了 custom-elements。min.js 因为我们也使用自定义元素的 v1 规范。

此后，Web 组件在 IE 11 中可见。

IE 11 中的 WebComponents 支持 - PolyFills

WebComponents Support in IE 11 - PolyFills

javascript

google-web-component