具有javascript依赖关系的聚合物元素

Question

我已经创建了一个用于渲染markdown的Polymer元素,它使用了marked.js库.我想知道,在其依赖项中加载的推荐方法是什么？

我应该只使用脚本标签吗？

<script src="../marked/lib/marked.js"></script>

或者将所有依赖项放入html导入并链接到该文件会更好.在这种情况下,我只有一个依赖,但我可以轻松拥有更多.

<!-- in scripts.html -->
<script src="../marked/lib/marked.js"></script>
<script src="../foo/foo.js"></script>
<script src="../bar/bar.js"></script>

<!-- in mark-down.html -->
<link rel="import" href="scripts.html">

注意:这些路径假设我的元素(及其依赖项)正在与bower一起安装,因此它们都应该是兄弟姐妹bower_components.

Answer 1

私有资源应安装在组件文件夹中并直接使用.但共享资源,我想要使用的其他组件(如marked)的那些资源应该作为依赖项处理.

我们建议使用两种约定来处理共享依赖项:

1. 始终使用规范的路径是../<package-name>(你这样做的话).按照惯例,聚合物需要一个平坦依赖文件夹(由Bower支持),因此您需要的任何资源必须始终位于此路径上.
2. 引用共享资源的导入.

在这种情况下,

<script src="../marked/lib/marked.js">

符合第一个公约.您的组件可以依赖于marked包并期望它存在于../.

第二项公约支持分享.如果项目中的多个组件使用script标记加载库,则库将加载多次.另一方面,导入是重复数据删除,因此您没有此问题.

例如,如果所有组件都加载marked标准方式:

<link rel="import" href="../marked-import/marked-import.html">

那么你只会加载一个脚本副本.

此外,导入允许您间接实际资源.例如,通常marked-import会依赖marked并使用script标记来加载JavaScript.但实际上,任何特定项目作者都可以修改本地marked-import.html以从CDN或任何其他位置加载主代码.通过导入来间接所有访问,我们创建了一个单一的控制点.

今天,marked和其他图书馆不包括导入文件,所以我们必须填补这些空白.此外,它还需要与其他组件协调(以便就任何特定共享资源的标准导入名称达成一致).正如(如果)采用这些惯例,这些问题将随着时间的推移而减少.

因此,您安装的组件看起来像这样:

/components
  /mark-down - depends on marked-import
  /marked-import - (controlled by user, can just depend on `../marked`)
  /marked