0

我正在示例应用程序中尝试 webcomponents。由于某些浏览器不包含某些规范，因此我尝试对这些规范使用 polyfill。在 Mozilla firefox 中，我尝试启用键 dom.webcomponents.enabled 并添加一些 polyfill（不在浏览器中）。我使用了来自 webcomponents.js polyfill 的 HTML Import polyfill。

HTMLImport 仍然不能在 firefox、internet explorer 中工作（即使使用 polyfill）。( https://github.com/webcomponents/webcomponentsjs )

我还尝试了 customElements v1 polyfill，不能在 Internet Explorer 和 Firefox 中工作。( https://github.com/webcomponents/custom-elements )

有没有人成功地将 HTMLimports polyfill 与 customElements V1 polyfill 包括在内？

4

1 回答 1

2

要在 Firefox 中使用带有 HTML 导入的自定义元素 v1：

  1. 不要激活 Firefox 标志，因为实施已过时。
  2. 安装webcomponentsjs（例如使用 bower），并在您的主文件中仅htmlimports.min.js包含文件。
  3. 安装自定义元素（来自您的链接）并包含在您的主文件custom-elements.min.js中。

您的主页应如下所示：

<head>
   <script src="htmlimports.min.js"></script>
   <script src="custom-elements.min.js"></script>
   <link rel="import" href="your-components.html">
</head>
<body>
    <your-component></your-component>

注意：对于第 3 步，您也可以使用document-register-element。

您不能直接将自定义元素 v1class语法与 Internet Explorer 一起使用，因为class未实现。您首先需要使用像 Babel 这样的转译器来转换源代码。

或者，使用现代版本 (Edge)，或使用prototype语法。

于 2017-01-19T10:45:14.097 回答