Question

我刚开始学习和使用聚合物，我已经完成了所有的安装和进口，就像谷歌的聚合物网站一样，但我仍然无法使单个聚合物元素起作用。这些是文件： bower.json

{
  "name": "take0",
  "description": "0.0",
  "main": "index.html",
  "moduleType": [
    "amd"
  ],
  "keywords": [
    "polymer"
  ],
  "authors": [
    "Balajee"
  ],
  "license": "MIT",
  "homepage": "",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {
    "core-component-page": "Polymer/core-component-page#^0.5",
    "core-elements": "Polymer/core-elements#^0.5.6",
    "paper-elements": "Polymer/paper-elements#^0.5.6",
    "platform": "Polymer/platform#^0.4.2",
    "polymer": "Polymer/polymer#^1.3.0"
  }
}

的index.html：

<!DOCTYPE HTML>
<html>
    <head>
        <title>
            Take 0 on polymer
        </title>
      <link rel"import" href="bower_components/polymer/polymer.html">
        <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
       <!-- Componenet kicks in-->
       <link   rel="import" href="components/component-one.html">
       </head>    
        <body>
            <component-one>
            </component-one>
        </body>
</html>

部件/组件one.html：

<link rel="import" href="../bower_components/paper-button/paper-button.html">
<!-- Component one-->
<dom-module id="component-one">
  <style>
    paper-button.fancy {
      background: green;
      color: yellow;
    }
    paper-button.fancy:hover {
      background: lime;
    }
  </style>
  <template>
    <h1>{{title}}</h1>
    <p>Ready to take you out with polymer!!</p>
    <paper-button raised>
      Click Me!!</paper-button>
  </template>
</dom-module>
<script>
  Polymer({
    is: "component-one",
    properties: {
      title: {
        type: String,
        value: "Hello World!!!"
      }
    },
    ready: function() {
      console.log("I'm Working!!!!!")
    }

  });
</script>

我花了2天的时间来寻找问题，找不到任何可以解决问题的方法。

Answer 1

这里的问题是你正在使用Polymer 1.3.0，其元素是为古老的＆＃39;聚合物0.5。

尝试使用以下内容替换bower.json文件的相关性部分：

"dependencies": {
  "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
  "iron-elements": "PolymerElements/iron-elements#^1.0.0",
  "paper-elements": "PolymerElements/paper-elements#^1.0.0",
  "polymer": "Polymer/polymer#^1.3.0"
}

您可以看到core-elements库替换为iron-elements。

为避免此类错误，我建议您始终使用Polymer Elements Catalog查找Google元素（例如此处为the paper-button page，使用菜单抽屉底部显示的推荐bower命令导入它）。

另外，如果您在Github或customelements.io上找到一个有趣的元素，请务必检查它bower.json以确定它所基于的Polymer版本。

不能使用任何聚合物元素

1 个答案: