0

I try to use the Blueimp Gallery in Webpack. Blueimp gallery defines a global function blueimp. Usually, one can create a Gallery using var x = blueimp.Gallery(...);

However, when I am using webpack, the blueimp-object gets hidden from me.

I imported blueimp Gallery in my main JS file using:

import 'blueimp-gallery/js/blueimp-gallery.min'; import 'blueimp-gallery/css/blueimp-gallery.min.css';

when I try to access blueimp, e.g. with console.log(blueimp);, I get a:

Uncaught ReferenceError: blueimp is not defined

I probably need some sort of loader of predefination, like I did with jQuery:

window.$ = window.jQuery = require("jquery");

and in the webpack config js

new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery"
        })

But no matter how I try to configure require(anything blueimp); and/or a ProvidePlugin, blueimp will not be visible.

What am I missing?

This question is totally not solving my problem. I am not creating own modules, I wanna use the module I did download via npm.

Community
  • 1
  • 1
Sean
  • 3
  • 1

1 Answers1

0

Access all the variables in the window. Try:

window.blueimp
Sterling Beason
  • 622
  • 6
  • 12
  • Awesome! Removing `import 'blueimp-gallery/js/blueimp-gallery.min';` and adding `window.blueimp = require("blueimp-gallery/js/blueimp-gallery.min");` while then accessing `window.blueimp()` instead of accessing `blueimp.Gallery()` did the trick! – Sean May 04 '17 at 08:20