Question

我有：

main.js

var _ = require('underscore');
var $ = require('jquery');
var mainUI = require('./main-ui');

mainUI();

主要-ui.js

var $ = require('jquery');
module.exports = function() {
    $('[data-toggle="tooltip"]').tooltip({
        placement: 'bottom'
    });

    $('#sb_toggle').on('click', function () {
        $('#sidebar').toggleClass('hide');
        $(this).toggleClass('show-sidebar');
    });
};

我是否正确地假设我必须在每个模块中都要求jquery？

为什么它不能简单地通过在main.js文件中要求jquery来工作，以便该行之后的所有必需模块都有$？

Answer 1

Browserify没有这样的工作。基本上每个模块都在IIFE中进行沙箱化。

这是因为jQuery使用UMD pattern。结果，什么时候 jQuery用于NodeJS环境它不公开全局变量

您可以通过多种方式处理此问题：

使用factor bundle
使用Browserify＆＃34;全球＆＃34; （对浏览器窗口对象的引用）对象：global。$ = require（＆＃39; jquery＆＃39;）
只需使用jQuery＆＃34; classic＆＃34;将它作为一个独立的库包含在内。使用＆＃34;脚本＆＃34;标签：

第四种选择需要一点重复。假设你包含了＃34; main＆＃34;模块到处都需要jquery，你可以使用＆＃34; main＆＃34;公开对所需内容的引用（在本例中为jquery）。

例如（假设文件名是main-ui.js）：

// This is a how "main-ui" should look like
var $ = require( 'jquery' )

// ... Some business logic
function drawColor( color ) { ... } 

// Exposed members:
return {
    $: $,
    colorDraw: drawColor  
}

这就是每个需要jquery的模块应该是这样的：

var $( "../main-ui.js" ).$ // <-- Notice the path should be relative to the current working directory

// .. Use '$' like you always do.

Answer 2

怎么样：

global.jQuery = global.$ = require("jquery");

这似乎工作正常，或者是否有一些我想念的险恶？

Browserify模块依赖项

2 个答案: