html - Polymer 1.0 一次导入所有元素

Question

我已经开始锁定 Google 的新 Polymer SDK，现在我开始学习了，我问自己是否可以一次包含论文组的所有元素？否则我的标题会随着我的实际主体代码而变大...

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

Answer 1

您可以通过多种方式实现这一目标，这些方式可以相互结合使用。

导入整个元素集合

正如一些评论者指出的那样，这个建议不再有效。当前有 a PR open on the iron-elements repository这将允许此功能。如果您觉得它有用，那么我建议留下一些支持评论 (+1)。

如果在开发和/或原型(prototype)制作过程中，您希望方便灵活地访问所有不同的paper-elements 和iron-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。