Building Your Library with Webpack

[00:00:00]
>> Sean Larkin: Should you build your library with Webpack?
>> Sean Larkin: The only time that I would consider it is if you were going to have to ship something that could be loaded with a script tag, like a UMD bundle. UMD is like the universal module definition. Basically just means that it can be loaded with VSM, it could be loaded with common JS, and it could be loaded in a script tag.

[00:00:28]
And we have a feature that supports it, so if you take a look at our documentation, we have, so webpac.js.org/configuration. I think it's /output. And you would want to be setting a library, here we go. So this really is just a great way to test whether or not you are, or to set how impact can create a UMD bundle, right?

[00:00:59]
It changes the outer run time. But I say this with extreme caution. If you yourself are using Webpack, don't consume a bundle that's been bundled by Webpack, even if it's a library. You lose out on being able to tree shaken, scope hoist or any of the optimizations, right?

[00:01:18]
Because it's a self contained run time. So typically, if I'm building something, I'm always gonna build it for myself first and if it's open source then I might add something else. But I'm kind of bias and I'm really strict with performance. So I don't even wanna create a UMD bundle for somebody.

[00:01:35]
I would rather say use a bundler and consume the raw modules, right? So my short answer is yes. I don't do it myself, personally, because I want people to use a build tool to consume the modules in a way that can be tree shaken, scope hoisted, optimized and work really well in the browser.

[00:01:55]
And even be code split right? Cuz you can't really code split a library that's been bundled like with this, which is the UMD bundle runtime. So, hopefully that asks, to those who were curious out there, asking yesterday and in the feedback. I would say if you're gonna bundle something, at least if Webpack is one of your consumers, just ship the raw modules, raw ES7.

[00:02:21]
I would even say don't even transpile the ES6 syntax. Leave that there, too. And let Babble, in your local Webpack application, like, load it and transpile it down. You could spend a whole class on that with just Babble, as well. But Henry Zhu is a good resource to reach out to for that.

[00:02:40]
[LAUGH] I always throw him under the bus there