Plugin Error Uncaught TypeError: Cannot read property 'call' of undefined .. Bootstrap

sage
,
1

Hello,

I have been having run into a an issue trying to use the external plugin material-photo-gallery. I believe I have got webpack to correctly add the plugin as I can see it’s code with in the compiled main.js file. However when I load the site I keep receieving the error:

Uncaught TypeError: Cannot read property 'call' of undefined
at __webpack_require__ (bootstrap afebad0d800a6efe263e:19)
at Gallery._layout (material-photo-gallery.js:125)
at new Gallery (material-photo-gallery.js:39)
at HTMLDocument.<anonymous> (common.js:172)
at i (jquery.js?ver=1.12.4:2)
at Object.fireWith [as resolveWith] (jquery.js?ver=1.12.4:2)
at Function.ready (jquery.js?ver=1.12.4:2)
at HTMLDocument.K (jquery.js?ver=1.12.4:2)

I have tried just about every conceivable solution I can find and still no luck. I am not sure whether this is an actual bug, as the plugin works perfectly with a CDN.

Any help would be most appreciated.
Thanks in advance

For reference the plugin was imported via:

yarn add material-photo-gallery

and added to the main.js file with:

// import external dependencies
import 'jquery';
import 'material-photo-gallery';

and defined in common.js with:

    const Gallery = require('material-photo-gallery');
     var elem = document.querySelector('.m-p-g');
     /* eslint-disable */
     var gallery = new Gallery(elem);
     /* eslint-enable */
2

Hey @elvinos - I did a little testing and didn’t come across a solution quickly. I think this is more of a problem with the package or with webpack than anything related to Sage specifically–your best bet might be to check if other users (or the package or webpack) have run into similar problems, or try to contact the package’s devs–though it looks kind of abandoned, so you may not have much luck there.

In a pinch, you could always try loading it the old-fashioned way (enqueuing it) or just see if you can find an alternative package that’s easier to set up.