Configure a generic jQuery plugin with Browserify-shim?

Question

I\'m using browserify-shim and I want to use a generic jQuery plugin. I have looked over the Browserify-shim docs multiple times and I just can\'t seem to understand what\'s

Answer 1

I was using wordpress. Hence, I was kind of forced to use the wordpress core's jQuery, available in window object.

It was generating slick() not defined error, when I tried to use slick() plugin from npm. Adding browserify-shim didn't help much.

I did some digging and found out that require('jquery') was not consistent always.

In my theme javascript file, it was calling the wordpress core's jquery.

But, in slick jquery plugin it was calling the latest jquery from node modules.

Finally, I was able to solve it. So, sharing the package.json and gulpfile configuration.

package.json:

"browserify": { "transform": [ "browserify-shim" ] }, "browserify-shim": { "jquery": "global:jQuery" },

gulpfile.babel.js:

browserify({entries: 'main.js', extensions: ['js'], debug: true}) .transform(babelify.configure({ presets: ["es2015"] })) .transform('browserify-shim', {global: true})

Doing transform 'browserify-shim' was crucial part, I was missing earlier. Without it browserify-shim was not consistent.