为什么 Safari/Firefox 无法识别 Polymer答案

【问题标题】：Why does Safari/Firefox not recognise Polymer为什么 Safari/Firefox 无法识别 Polymer
【发布时间】：2017-04-17 11:44:35
【问题描述】：

我正在试验 Polymer-2/webcomponents，并成功完成了 this 教程。此外，我添加了一个试用文件，它在 Chrome 中加载和显示（虽然没有正确的嵌套），但在 Safari（10.0.3）和 Firefox（52.02）中根本不显示，我看到 Reference error: can't find variable Polymer 所有依赖项似乎在 bower_components 下可用，当我在 FF 和 Safari 的控制台中输入 Polymer 时，Polymer 似乎已被定义，所以可能是时间问题？还有什么问题？

<!doctype html>
<html lang="en">
<head>
  <script>
  window.ShadyDOM = { force: true };
  </script>
  <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
  <link rel="import" href="bower_components/polymer/polymer.html">
</head>
<body>
   <dom-module id="my-foo">
    <template>
      <h1>
        <slot></slot>
      </h1>
    </template>
    <script>
      Polymer({ is: 'my-foo' });
    </script>
  </dom-module>
  <dom-module id="my-bar">
    <template>
      <i>
        <slot></slot>
      </i>
    </template>
    <script>
      Polymer({ is: 'my-bar' });
    </script>
  </dom-module>
  <my-foo>
    <my-bar>Hello world!</my-bar>
  </my-foo>
</body>
</html>

【问题讨论】：

标签： javascript firefox safari polymer polymer-2.x

【解决方案1】：

尝试添加：

 <!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->
  <script src="/bower_components/webcomponentsjs/webcomponents-loader.js"></script>

【讨论】：

感谢您的回答，但现在我收到很多错误，例如A custom element with name dom-if|bind|module|selector' has already been defined

【解决方案2】：

如果您将文档模板移动到单独的文件中并将link rel=import href.. 移动到该文件中，效果会很好。

【讨论】：