Hello and thank you. Great intro!
Mickey Vashchinsky

Hey Mickey,

Thanks for the feedback! Let’s say you have an application.js entry point for webpack, and directly in that file you declare function myFunction() { console.log('Works!'); }. If you try and call myFunction() from, say, a script tag on the page, you’ll get a ReferenceError: Can’t find variable: myFunction. That’s because by default, everything in webpack is isolated from your window. This is a good thing—it’s doing what it’s supposed to.

But what if you wanted to access that function from the DOM? That’s what the output.library setting is there for. In webpack.config.js if you set

module.exports = {
output: {
library: 'myLibrary',

… then you could run myLibrary.myFunction(); from the DOM just fine. If you set output.library to 'someOtherLibrary', then you’d call someOtherLibrary.myFunction(); instead. webpack simply lets you specify any name you’d like to access everything in application.js from.

More info: https://webpack.js.org/concepts/output/#output-library

Edit: capitalization

Show your support

Clapping shows how much you appreciated Drew Powers’s story.