Polymer 1.0一次导入所有元素

时间:2015-06-04 19:32:35

标签: html polymer polymer-1.0

我已开始锁定Googles新的Polymer SDK, 既然我开始学习,我问自己是否可以同时包含纸质组的所有元素?否则我的标题会变得更大,因为我的实际身体代码...

<link rel="import" href="bower_components/paper-toolbar/paper-toolbar.html">

3 个答案:

答案 0 :(得分:5)

有几种方法可以实现这一点,可以相互结合使用。

导入整个元素集合

正如一些评论者指出的那样,这个建议已经不再适用了。目前有a PR open on the iron-elements repository允许此功能。如果它是您认为有用的东西,那么我建议留下一些支持评论(+1)。

如果在开发和/或原型设计期间,您希望一次访问所有不同的paper-elementsiron-elements的便利性和灵活性,元素集合存储库提供了有用的帮助包含每个集合的所有导入的HTML文档。您可以像这样导入它们:

<link rel="import" href="bower_components/iron-elements/iron-elements.html">
<link rel="import" href="bower_components/paper-elements/paper-elements.html">

请注意,这通常是您希望在生产环境中执行的操作,因为它会加载许多不必要的导入并浪费带宽。但是,对于开发而言,它非常方便,因为您可以轻松地尝试新元素,而无需在每次使用时为其添加导入。

外部化您的导入代码

由于HTML导入的流畅特性,您可以轻松定义第二个HTML文档,就像Polymer元素作者在元素集合中所做的那样,但对您自己而言。此文件可以包含您计划使用的所有元素的列表。只需创建一个如下所示的文档:

<link rel="import" href="bower_components/paper-input/paper-input.html">
<link rel="import" href="bower_components/paper-toolbar/paper-toolbar.html">
<link rel="import" href="bower_components/iron-a11y-keys/iron-a11y-keys.html">
<link rel="import" href="bower_components/some-other-component/some-other-component.html">

然后,将其导入您需要选择的元素的页面中

<link rel="import" href="common_elements.html">

硫化

Google提供了vulcanize,这是一种工具,可以解析您的导入及其依赖项,并将它们压缩为单个文件。与上面的导入列表不同,此文件实际上具有导入的内容,而不仅仅是对它们的引用。在将应用程序部署到生产环境时,您可能需要考虑这一点。

硫化的文档以及工具本身可在https://github.com/polymer/vulcanize

获取

答案 1 :(得分:0)

您可以使用Google的Vulcanize工具组合所有元素。 https://github.com/polymer/vulcanize

答案 2 :(得分:0)

我遇到了同样的问题,而其他人指出你可以制作一个导入文件。我制作了一个自动执行此过程的脚本,您可能会对遇到同样问题的其他人感兴趣。它会自动从工作目录中的元素生成导入文件。 =)

https://gist.github.com/draganmarjanovic/0bef6c298da767bf38b1