Question

您好我正在使用grunt browserify任务来设置我的代码，我已经在jQuery中填充了，我现在正尝试包含jquery.tablesorter。

jquery插件能以这种方式与browserify一起使用吗？

shim: {
    jquery: {
        path: 'lib/bower/jquery/jquery.js',
        exports: '$'
    },
    'jquery.tablesorter': {
        path: 'lib/bower/jquery.tablesorter/js/jquery.tablesorter.js',
        exports: 'tablesorter',
        depends: {
            jquery: '$',
        }
    }
}

Answer 1

您可以尝试这样做：

shim: {
    jquery: {
        path: 'lib/bower/jquery/jquery.js',
        exports: '$'
    },
    'jquery.tablesorter': {
        path: 'lib/bower/jquery.tablesorter/js/jquery.tablesorter.js',
        exports: null,
        depends: {
            jquery: '$',
        }
    }
}

如果以上操作不起作用，您可以尝试：

shim: {
    jquery: {
        path: 'lib/bower/jquery/jquery.js',
        exports: null
    },
    'jquery.tablesorter': {
        path: 'lib/bower/jquery.tablesorter/js/jquery.tablesorter.js',
        exports: null,
        depends: {
            jquery: 'jQuery',
        }
    }
}

Answer 2

如果你使用这个扩展，也许你不需要在package.json中使用“browserify-shim”部分。

你可以这样做Using Browserify with jQuery Plugins

我已经尝试过它并且有效。

示例

的package.json

"browserify": { "transform": ["browserify-shim"] }, "browser": { "jQuery.translit": "./public_html/js/vendor/jquery/jquery.translit.js" }, "browserify-shim": { "jQuery": "global:jQuery" }

JS档案：

var $ = require("jQuery"), translit = require("jQuery.translit"), //don't use this variable heading = require("./helper/heading.js"); $.transliterate("parameter"); //use as regular jQuery plugin instead

Answer 3

更容易要求global.JQuery然后需要你的模块，它不需要更改package.json：

{{1}}

使用browserify填充jQuery插件

3 个答案: