Transcript from the "Webpack Chunking" Lesson
>> Brian: So let's talk about chunking. This is one of the more advanced features of Webpack, but I find it really compelling so I wanted to talk about it. And it's, I would say, one of the lesser known features of Webpack. So we have this big problem right now.
[00:01:01] Not only that, if you have a bunch of modules, right, it would be great if you could only download the correct modules for the correct pages. So Webpack actually has this magically built into it, because it builds a dependency graph of all of your different dependencies. And if you say, hey Webpack, I only want this page, it's smart enough to say, okay, this page only has these things, and it only shares these modules with these different other modules.
[00:01:26] So it's smart to be able to section off as okay, for example, we use axios on details but nowhere else, it says okay, I will only load axios when I'm on details but nowhere else. So that's what Webpack chunking is and I swear it's absolutely magical. It's going to just blow your mind.
[00:01:46] Okay, so first we need to tell Webpack yes, we wannna do chunking. So let's go to webpackconfig real quick.
>> Brian: Inside the output config object. So we need to tell,
>> Brian: Webpack where to put all the chunks. And we're gonna say publicPath here, :/public/. So you need both of those.
[00:02:19] So this is actually telling axios where am I serving my static files from on my server. Webpack has to know that because it has to know where to ask for those bundles, okay? And now we're gonna change chunks from false to true, because we actually do wanna see that data now.
>> Brian: Okay, so that's it. Webpack is, after that, smart enough to know what to do. I do have a mistake here that you'd offer in my dependencies. So just do an npm install --save node-ensure.
>> Brian: Okay, pretty sure that's the line I needed.
>> Brian: Yes, that's exactly the one I needed.