I'm trying to use the inview plugin within my app, which uses RequireJS to load scripts and is being built / optimised with Almond. I get a console error:
TypeError: 'undefined' is not an object (evaluating 'global.jquery.inview')
Which appears to come from the shim that require is adding to the end of the inview file:
define("jquery.inview", ["jquery"], (function (global) {
return function () {
var ret, fn;
return ret || global.jquery.inview;
};
}(this)));
My require config is as follows:
require.config({
paths: {
'jquery': '../../bower_components/jquery/dist/jquery',
'text': '../../bower_components/requirejs-text/text',
'tweenmax': '../../bower_components/greensock/src/uncompressed/TweenMax',
'jquery.inview': '../../bower_components/jquery.inview/jquery.inview'
},
shim: {
"jquery.inview": {
deps: ['jquery'],
exports: 'jquery.inview'
}
}
});
Any help much appreciated!
jquery.inview
is a jQuery plugin. Therefore it installs itself as plugins do, by modifying$
. When you tell RequireJS that it exportsjquery.inview
RequireJS tries to resolvejquery.inview
in the global space, which does not work because jQuery is accessible in the global space as$
orjQuery
, and not asjquery
.You could leave the
exports
out or set it to something thatjquery.inview
does define. For instance, reading the code ofjquery.inview
I see that it sets$.event.special.inview
so you could use this in yourexports
.In case you are wondering, for jQuery plugins the
exports
value is useful only for RequireJS' bookkeeping. You don't yourself access the plugin through the value it exports but through the API it exposes through jQuery.