I'm using Browserify 11.2 and Browserify Shim 3.8 and am attempting to utilize slick-carousel (included via npm) with a jQuery loaded from a CDN. I realize that this requires the use of Browserify shim, but I am unable to get it to work.
Here is the relevant portion of my package.json
file.
"devDependencies": {
...
"browserify": "^11.2.0",
"browserify-shim": "^3.8.10",
...
"slick-carousel": "^1.5.8",
...
},
"browserify": {
"transform": [
"browserify-shim"
]
},
"browser": {
},
"browserify-shim": {
"jquery": "global:jQuery",
"slick-carousel": {
}
},
"dependencies": {
}
When attempting to require slick-carousel, I get the error:
Cannot find module 'jquery' from 'path_to_node_modules/node_modules/slick-carousel/slick'
However, if I output require('jquery') to a constant (e.g.)
const jq = require('jquery')
, jquery is there as I would expect.
Right now my script just contains the following for testing:
require('jquery');
require('slick-carousel');
I've always had a tough time wrapping my head around Browserify Shim - any guidance on what I'm doing wrong is appreciated.
You need to specify that slick-carousel depends on jQuery in your package.json
:
"browserify": {
"transform": [
"browserify-shim"
]
},
"browserify-shim": {
"jquery": "global:jQuery",
"slick-carousel": {
"depends": [
"jquery: jQuery"
]
}
},