Using Browserify with jQuery Plugins

browserify, browserify-shim, javascript, jquery, node.js

Solution

Turns out you don't need to declare every jQuery plugin under `browserify-shim` if it only depends on jQuery. I just deleted the inview entry and everything works fine.

Problem

Some brief background: I'm using browserify and browserify-shim (and gulp to build) to create a web app. Prior to this issue, I was `require`ing jquery from npm so I had no issues. Once I started doing some optimization, I realized how massive the bundle was with jQuery included. So now I'm grabbing jQuery from a CDN with the script tag and placing it before the bundle.js file. But I'm having issues declaring jQuery as a global and properly shimming my jQuery plugins in browserify and browserify-shim. When I run gulp to build, I keep getting the same error: `[gulp] gulp-notify: [Compile Error] module "jquery" not found from "/Volumes/Chetan/Users/cshenoy/Projects/urbanstems-node/app/plugins/jquery.inview.js"` It seems like browserify-shim isn't picking up on jQuery being a global. For reference, I'm using the inview plugin. Here's my package.json with the relevant parts ``` "browser": { "inview": "./app/plugins/jquery.inview.js" }, "browserify-shim": { "jquery": "global:jQuery", "inview": { "depends": [ "jquery" ] } } ``` Let me know what else I can include to help diagnose the error.

Original source