限制在RequireJS范围之外定义的脚本的使用

时间:2014-05-01 18:35:46

标签: javascript requirejs prototypejs ractivejs

我有一个我无法修复的范围(全局变量/命名空间)问题。问题是我在项目中有一些遗留代码,我在其中使用Require.js添加了新功能。此遗留代码使用标准<script>标记加载,但新代码使用Require加载。当我在Require as AMD中添加Ractive.js时会出现问题。因为遗留代码加载了Prototype.js,所以它与Ractive.js有一些冲突。

主要问题是观察数组的变化。具体来说,当我用模式观察者观察数组时。

ractive.observe('dataArray.*', function(newValue, oldValue, keypath) { alert(' status changed from ' + oldValue + ' to ' + newValue); }, {debug: true, init: false});

如果我不向数组添加观察者,一切正常,但如果我添加它,我在prototype.js中得到一个错误undefined is not a function(当我从globals中删除prototype.js时不会发生这种情况) 。

另一个是,当我不使用模式观察者时它实际上有效。

所以,我的问题是,有没有办法将Require.js配置为仅使用作为AMD-s加载的脚本? 或者,换句话说,将AMD脚本的范围仅限于彼此,以便忽略全局脚本?

提前致谢。

1 个答案:

答案 0 :(得分:1)

我能够通过向页面添加旧版本的Prototype.js来创建类似的错误。我怀疑是因为Prototype.js向Array.prototype添加了非标准方法(除此之外)。这通常被认为是一件坏事,因为它在大型代码库中很可能会发生这种类型的冲突。

具体来说,错误是Ractive在处理模式观察者时对字符串调用Array.prototype.mapmap函数在ES5中是标准函数,但在旧版浏览器(例如IE8)中不是,因此Prototype添加了polyfill - 但在旧版本的Prototype中,它是一个破碎的polyfill。当您使用字符串而不是错误(因为它使用自己的this.each()方法)调用它时,破坏的polyfill会抛出错误 - 这是ES5中一个不寻常但完全可以接受的操作。

幸运的是,看起来Prototype的更新版本没有以同样的方式被破坏。我能够使用1.6.1(他们的文档站点上的版本,即2009年)重现错误,但不能使用最新的1.7.2版本。

所以你有两种可能的选择:

  • 将原型升级到最新版本
  • 加载Prototype后,覆盖损坏的map()方法。您可以使用this polyfill from MDN(请确保省略if (!Array.prototype.map){...}支票)。

其中,第二个可能最不可能破坏依赖于Prototype的代码!