我创建了a Polymer element for rendering markdown,它使用了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中的同级对象。

最佳答案

专用资源应安装在组件文件夹中并直接使用。但是共享资源,我其他组件也想使用的那些资源(例如marked),应该作为依赖项来处理。

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

  • 始终使用../<package-name>的规范路径(您已经这样做了)。按照惯例,Polymer需要一个平面依赖性文件夹(Bower支持),因此,您需要的任何资源都必须始终在该路径上。
  • 引用共享资源的导入。

  • 在这种情况下,
    <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
    

    09-16 16:28