为什么这个jquery插件不需要垫片才能工作？ [英] Why doesn't this jquery plugin need a shim in order to work?
问题描述
填充jQuery插件似乎只适用于在正确肩膀上扔盐的天才。
Shimming a jQuery plugin appears to be only for geniuses who throw salt over the correct shoulder.
但是我这样做了....
However I did this....
var backbone = require('backbone');
global.jQuery = global.$ = backbone.$ = require('jquery');
require('./libs/jquery-modal');
$("body").Modal();
它只是有效。 （n.b. jquery正在通过debowerify加载）
and it just works. (n.b. jquery is being loaded via debowerify)
为什么这样做？填补它意味着我不需要分配 jquery 和 $ ？
Why does this work? Would shimming it mean I don't need to do the assignments to jquery and $?
浏览器如何处理我的插件代码不是正确的commonjs格式？
And how is browserify able to handle my plugin code not being in the correct commonjs format?
推荐答案
<我假设你在谈论 browserify-shim 。
Shimming用于制作commonjs不兼容的文件浏览器。
Shimming is used for making commonjs-incompatible files browserifiable.
要兼容commonjs，文件必须导出一些内容。这是一个简单的commonjs模块：
To be commonjs-compatible, a file must export something. Here is a simple commonjs module:
// mystring.js
module.exports = "Hello Stackoverflow";
现在在其他一些文件中，您可能需要 mystring.js 并像这样使用它：
Now in some other file, you could require mystring.js and use it like this:
var str = require('./mystring.js');
console.log(str); // > "Hello Stackoverflow"
jQuery
In旧版本的jQuery（1.11和2.1之前版本）没有导出。相反，jQuery会将自己附加到窗口对象。这违背了模块化的整个概念，使您的代码依赖于对象和值在全局范围内。
jQuery
In older versions of jQuery (pre 1.11 and 2.1) nothing was exported. Instead jQuery would attach itself to the window object. That goes against the whole concept of modularity, making your code depend on objects and values to be present in the global scope.
以正确的顺序加载文件可能很棘手更复杂的环境。特别是如果某些配置文件更改了一些全局变量，并且当 window.foo 设置为bar但在其他脚本更新之前应执行脚本window.foo 值为qux。
Loading files in the right order could be tricky in more complex environments. Especially if some config files change some global variables, and your script should be executed when window.foo is set to "bar" but before other script updates window.foo value to "qux".
当我们在加载之前尝试使用jQuery时，我们得到一个 ReferenceError ：
When we try to use jQuery before it is loaded, we get a ReferenceError:
<!-- index.hmtl -->
<script>
var $body = $('body'); // ReferenceError: Can't find variable: $
</script>
<script src="jquery.js">
这是 browserify-shim 进入的地方玩。
本质上 browserify-shim 做这样的事情：
// jquery-shim.js
loadScript('jquery.js') // now, window.$ contains a reference to the jQuery object
module.exports = window.$; // exports that jQuery object
window.$ = null;
现在你可以在你的代码中的任何地方使用jQuery，而不依赖于它存在于全局范围内：
Now you can use jQuery anywhere in your code, without relying on it to be present in the global scope:
<!-- product-page.hmtl -->
<script> <!-- script is inlined for demo purposes only -->
var $ = require('./jquery-shim.js');
var $body = $('body'); // this works now
</script>
这是关于模块化你的项目并保持你的全球范围清洁。
It is about modularizing your project and keeping your global scope clean.
这篇关于为什么这个jquery插件不需要垫片才能工作？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
