Polymer 0.8 "Uncaught ReferenceError: Polymer is not defined"

Question

最近我决定测试 Polymer 0.8 而不是仅仅阅读它，但是我遇到了一个错误："Uncaught ReferenceError: Polymer is not defined".

我觉得这很简单，但我错过了，我似乎无法弄明白。

下面是我从 feature overview 文档中复制粘贴的代码：

<script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>

<dom-module id="element-name">
  <style>
    /* CSS rules for your element */
  </style>
  <template>
    <!-- local DOM for your element -->

    <div>{{greeting}}</div> <!-- data bindings in local DOM -->
  </template>
</dom-module>

<script>
  // element registration
  Polymer({
    is: "element-name",

    // add properties and methods on the element's prototype

    properties: {
      // declare properties for the element's public API
      greeting: {
        type: String,
        value: "Hello!"
      }
    }
  });
</script>

<element-name></element-name>

提前致谢。

Answer 1

webcomponents-lite.min.js 是 Shadow DOM 和 html Imports 的 Polyfill，您应该将其添加到您的 main.html 页面，而不是您的自定义组件中。

相反，您应该在添加 Polyfill 的位置添加聚合物库。

下面是一个示例代码：

<link rel="import" href="/bower_components/polymer/polymer.html">

<dom-module id="element-name">
  <style>
    /* CSS rules for your element */
  </style>
  <template>
    <!-- local DOM for your element -->