How to make a variable global in Webpack

Question

I'm trying to import the Politespace library into a Webpack project. It's written such that on a certain line it tries to attach a global Politespace object to the window object, which is needed for an event listener on the document object to correctly behave.

But when trying to load this in Webpack by putting an import into vendor.js I'm seeing that w comes out as just an object - it seems like Webpack is substituting a different variable, so that it's never attached to the window.

Is there a way to allow importing libraries that assign global properties to Window, other than having to copy and paste the file and modify it to refer specifically to the window rather than w (which I've verified does work)?

Dimitris Karagiannis · Accepted Answer · 2017-01-09 17:19:31Z

2

You can do that by using the imports-loader

You can use it in 2 ways; either when you require() the library by doing something like

require("imports-loader?this=>window!politespace");

or by setting it up in the webpack.config.js like so (as per documentation)

module.exports = {
    ...
    module: {
        loaders: [
            {
                test: require.resolve("some-module"),
                loader: "imports-loader?this=>window"
            }
        ]
    }
};

answered Jan 9, 2017 at 17:19

Dimitris Karagiannis

9,4669 gold badges45 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to make a variable global in Webpack

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related