JSFiddle中如何导入核心元素和纸张元素答案

【问题标题】：How to import core elements and paper elements in JSFiddleJSFiddle中如何导入核心元素和纸张元素
【发布时间】：2014-10-30 09:31:26
【问题描述】：

如何在JSFiddle 中导入core elements 和paper elements。

我通过这些语句导入polymer：

<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.4.2/platform.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.4.2/polymer.js"></script>

如何导入例如core-input 或paper-input？

【问题讨论】：

标签： javascript polymer jsfiddle paper-elements core-elements

【解决方案1】：

是的，来自聚合物项目网站，或者如果你知道位置，我猜你的 cloudflare cdn

<script src="http://www.polymer-project.org/platform.js"></script>
<link rel="import" href="http://www.polymer-project.org/components/polymer/polymer.html">
<link rel="import" href="http://www.polymer-project.org/components/paper-button/paper-button.html">
<link rel="import" href="http://www.polymer-project.org/components/core-header-panel/core-header-panel.html">

这仅用于开发而非生产。

如果您转到polymer elements，然后选择您的元素并单击显示“获取元素”的按钮，它将为您提供一个带有导入链接的弹出窗口。

您还可以从here 获取所有核心或纸张元素的链接

【讨论】：

自 1.0 以来这些似乎不再有效。他们给404。但是您可以从polymer-cdn 获取它们。
啊，我想通了。对于旧版本，这些仍然可以使用，但您必须将 0.5 添加到 url：polymer-project.org/0.5/components/polymer/polymer.html
我认为这很可怕，虽然（除了0.5）URL 中没有版本。我个人认为您应该始终使用指向特定版本的 URL，而不是任何可能随时更改的“大师”...

【解决方案2】：

一个不错的选择 - 仍在进行中 - 是https://ele.io/

Ele（称之为“Ellie”）是一个简化的环境，用于探索、试验和共享使用 Web 组件制作的可重用自定义 HTML 元素。

【讨论】：

这看起来真的过时了。 GitHub 存储库最后一次更新是 2014 年 12 月，似乎不支持 Polymer 1.0。 github.com/divshot/ele-web
这里是 Ele 的创建者之一 - 很想为 Polymer 1.0 更新它，只是没有时间。

【解决方案3】：

为了测试一个用 Polymer 1.0 编写的简单组件，我使用了这个 sn-p：

<link rel="import" href="https://raw.githubusercontent.com/Polymer/polymer/master/polymer.html">

<dom-module id="proto-element">
    <template>
        <span>I'm <b>proto-element</b>. Check out my prototype.</span>
    </template>
</dom-module>

<script>
    Polymer({
        is: "proto-element",
        ready: function() {
            //...
        }
    });
</script>

<proto-element></proto-element>

http://jsfiddle.net/MartyIX/84b5sabw/

【讨论】：