Require.js加载应用程序的所有资源,包括Polymer

时间:2014-07-19 14:01:49

标签: javascript angularjs requirejs polymer

我正在为大型多开发人员项目构建应用程序框架。我出售的想法是使用Require.js和Angular来管理依赖和类加载。但现在我也想使用聚合物,因为它非常酷。

我如何使用require.js加载聚合物元素库,就像我的js一样?我喜欢坚持要求作为加载我所有应用资源的真正方式的想法。我看到能够将模板,脚本和样式捆绑到一个代表组件的逻辑.html文件中是多么美妙,我知道我们可以将这些部分分解为单独的文件,但是只要我看到任何链接rel ="进口"里面的东西,我觉得这是进入require.js的领域。

想法?

1 个答案:

答案 0 :(得分:3)

两者之间存在一些紧张关系,因为两者都希望成为跟踪依赖关系的记录系统。例如,如果您执行/components/core-ajax/core-ajax.html的http导入,它包含http导入../polymer/polymer.html,确保在运行core-ajax的任何脚本之前加载Polymer。 Polymer还有一个名为vulcanize的工具,用于将一组Web组件编译为单个文件,以减少生产中的HTTP请求数。

听起来很熟悉? require.js对所有这些部分都有类似的机制。同样值得注意的是,我不知道正在采取什么措施来统一所有这些,并且为了使事情变得更加复杂,ES6模块的提案正在逐渐增加。

我目前的建议是尽可能选择一个依赖关系跟踪器。如果您使用Web组件,我建议您使用HTML导入,因为将requirejs模块转换为简单的Web组件要比将其转换为相对容易,反之亦然。

e.g。假设你有一个依赖于jquery的脚本jquery.datatables.js。布置文件,如:

  • 部件
    • jquery.datatables
      • jquery.datatables.js
      • jquery.datatables.html
    • 的jquery
      • 的jquery.js
      • jquery.html

jquery.html将包含:

<script src='jquery.js'></script>

在jquery.datatables.html中你要放:

<link rel='import' href='../jquery/jquery.html'>
<script src='jquery.datatables.js'></script>

HTML Imports负责进行重复数据删除,因此您可以确信jquery.html只会加载一次。