使用聚合物和requirejs

在试图创建使用requirejs模块的聚合物元素时，我遇到了阻塞issue。据我所知，聚合物不适用于requirejs，但暂时这是我唯一的选择。使用聚合物和requirejs

寻找答案，我发现两个解决方案：

不要使用requirejs，使您的模块与HTML进口兼容。
将Polymer()呼叫requirejs回调中所描述的here

因为我必须使用需要，至少暂时，我去解决二号。但是，事实证明该解决方案会导致元素注册异步延迟，并导致incorrect data binding prior to Polymer upgrading the element。

深入研究这个问题，我开始黑客入侵未记录的Polymer内部组件，意图完全停止Polymer，直到requirejs完成它的事情。这是我想出了：

Polymer.require = function(tag, deps, func) { 
    var stopper = {} 
    Polymer.queue.wait(stopper); 
    require(deps, function() { 
     delete stopper.__queue; 
     Polymer.queue.check(); 
     Polymer(tag, func.apply(this, arguments)); 
    }); 
};

我知道这是非常错误的。有更好的解决方案吗？

来源

2014-09-24 Aki

我发现如果我在Polymer脚本中嵌入要求的呼叫，我会避免这个问题。

<link rel="import" href="../polymer/polymer.html"/> 
<script src="../requirejs/require.js"></script> 
<script src="../something/something.js"></script> 

<polymer-element name="some-component"> 
    <template>...</template> 
    <script> 
    (function() { 
     Polymer('some-component', { 
      someMethod: function() { 

       require(['something'], function (Something) { 
        var something = new Something(); 
        ... 
       } 
     } 
    )(); 
    </script> 
</polymer-element>

来源

2015-01-30 22:40:34

这留下了什么问题，你在哪里调用'require.config'，看到这个类似的[线程]（http://stackoverflow.com/questions/28673242/manual-bootstrap-in-polymer） – Renaud 2015-02-23 11:59:54

因此，有this solution斯科特英里，但我觉得这是一个有点简单化和不灵活的，因为它依赖于：

<script>标签才能被执行，因此排除：
- async script tags
- xhr based script loading
polymer得到从<script>标签加载，因此：
- layout.html并不会加载相关css
- 任何将来调用polymer.htmlwon't be deduped

如果您想了解更多控制您的引导逻辑，您将需要在组件之间实施一定程度的同步（这是requirejs和polymer竞争做的）在这些完全加载之前。

前面的示例是更具说明性的（读取polymer）做事方式，但缺少细粒度调整。我已通过started working on a repository向您展示如何通过使用更重要的方法完全自定义您的加载顺序，其中requirejs优先协调引导的其余部分。

在写这篇文章的时候，这个额外的控制的性能更差，因为各种脚本无法并行加载，但我仍在努力优化它。

来源

2015-03-18 16:52:23 Renaud

使用聚合物和requirejs

回答

相关问题