当前位置：文江博客话题详情

将代码与依赖项合并？

发布于 2024-10-08 19:36:52 字数 198 浏览 3 评论 0原文

这可能很简单，但我必须说我对这个话题有点困惑。

我正在基于两个流行的库编写代码：

jQuery
underscore.js

我只是想知道隔离代码和防止冲突的最佳方法是什么以及如何将其与其依赖项合并？

我的意思是把它们放在同一个文件中。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

飘然心甜 2024-10-15 19:36:52

您可以轻松地将它们两个放在同一个文件中，因为它们唯一变为全局的东西是 window._、window.$ 和 window.jQuery< /代码>。其他变量和函数都包装在本地作用域中，因此不会发生冲突。

编辑：您自己的代码也可以放入同一文件中。如果您希望删除全局变量，jQuery 和 Underscore 都有一个无冲突方法，该方法将全局变量替换为其旧值（通常是 未定义）。您可以将代码包装在您自己的本地范围内，这样就不再有问题了：

// jQuery and Underscore source here

// You code here, wrapped in a self-executing function:

(function($, _){

  // here you can add your code:
  $('#test').text('jQuery works');

  _(3).times(function(){
    alert('Underscore works' );
  });

})(jQuery.noConflict(true), _.noConflict());

// no jQuery nor Underscore here:

alert(typeof jQuery, typeof $, typeof _);

这看起来很棘手，但让我快速解释一下。您可以在定义函数后立即执行该函数，如下所示：

(function(){
  alert('I am being executed');
})();  // <-- basically how you call a function normally: func();

您可以在其中传递参数：

(function(a){
  alert(a);
})('test');

$.noConflict() 和 _.noConflict() 都删除全局变量变量并返回对 jQuery 和 Underscore 变量的引用。因此，您可以将这些作为参数传递到自执行函数中，每个人都很高兴（：

You could easily place the two of them in the same file, because the only things they turn global are window._, window.$ and window.jQuery. The other variables and functions are wrapped in a local scope, so there will be no conflict.

Edit: Your own code could be put in the same file too. And if you prefer to remove the globals, both jQuery and Underscore have a no-conflict method, which replaces the globals with their old values (often undefined). You could wrap your code in your own local scope and there'll be no problems anymore:

// jQuery and Underscore source here

// You code here, wrapped in a self-executing function:

(function($, _){

  // here you can add your code:
  $('#test').text('jQuery works');

  _(3).times(function(){
    alert('Underscore works' );
  });

})(jQuery.noConflict(true), _.noConflict());

// no jQuery nor Underscore here:

alert(typeof jQuery, typeof $, typeof _);

This looks quite tricky, but let me explain it very quickly. You can execute a function immediatly after defining it, like this:

(function(){
  alert('I am being executed');
})();  // <-- basically how you call a function normally: func();

And you can pass arguments in it:

(function(a){
  alert(a);
})('test');

Both $.noConflict() and _.noConflict() remove the global variables and return a reference to the jQuery and Underscore variable. So you can pass these in the self-executing function as arguments and everybody's happy (:

回复收藏 0 原文

~没有更多了~