Javascript 需要jQuery和lodash与browserify

我喜欢browserify的想法，但是我很难理解需要“全局”变量，比如jQuery和lodash。我希望：

// application.js
var $ = require('jquery')
var _ = require('lodash')
var a = require('./path/to/module/a.js')

// a.js
var $ = require('jquery')
var _ = require('lodash')

var AClass = function() {
  console.log($, _)
}
module.exports = AClass

使模块a可用

$

和

\

。毕竟，该代码是经过编译的，

$

和

\

是首先定义的。但是，我遇到了一个问题，页面将不会加载，因为

$

和

\

未定义。好吧，我不明白，但至少我希望：

// application.js
var $ = require('jquery')
var _ = require('lodash')
var a = require('./path/to/module/a.js')

// a.js
var $ = require('jquery')
var _ = require('lodash')

var AClass = function() {
  console.log($, _)
}
module.exports = AClass

没有问题地运行。但是，我不断收到错误消息，称未定义

$

和

\

，即使在这两个文件中以下代码都有效：

var $ = require('jquery')
var _ = require('lodash')
console.log($, _)

除此之外，我的应用程序还有什么问题吗？或者我对browserify有什么根本不了解的地方吗？

我们正在使用browserify（在我们的例子中是gulp），我们初始化全局对象，就像使用thw窗口对象一样。通过这种方式，如果必须进行一些测试，您还可以在控制台中使用它们

window._ = require('lodash');

或者，如果您使用ES6：

import _ from 'lodash';
window._ = _;

---

希望这有助于使用现代JavaScript工具避免全局变量。如果在浏览器中查看代码，您可能会看到如下内容：

(function() {
    var $ = require('jquery');
})();

由于

$

被包装在函数中，因此它不再是全局变量

解决此问题的正确方法是在

a

中添加require。这并不十分昂贵，因为

require（）

将始终为每个需求名称返回相同的（缓存的）对象

另一个选项是使用

window.$ = $;

第一个模块的内部。但这有几个缺点：

• 如果有人更改模块的顺序，它将中断
• 如果有人定义了另一个全局变量

  窗口。$

  ，它可能会中断

---

这就是为什么最好在每个模块中使用

require（）

。

如果你想在

a

中使用jquery和lodash，你需要在

a

模块中使用jquery和lodash。我有同样的问题，但我需要在同一个文件中使用lodash，然后才能扩展bla-lodash，但我不能在函数中使用lodash。。。这里的代码示例-你解决问题了吗？嗯，解决问题。只需重命名为“lodash”，一切正常；）