• Introduction
• Development
• Changing the Port
• Configuring SSL
• Configuring Basename
• Building
• Development
• Production
• Analyzing
• Stats
• Features
• Cache Busting
• Chunking
• CSS Preprocessors
• Favicon
• Fonts
• Images
• Source Maps
• Misc
• Verify Production Build Locally

Stats

Lore includes a couple scripts to generate stats about your webpack build. These stats can be quite helpful for understanding the size of your build, and how much of that size is attributed to specific packages.

Generate Stats

To illustrate, generate stats about the production build of your application by running this command:

npm run stats:production

Once this command finishes, you will have a file named stats.json at the root of your project.

Visualize Stats

Next navigate to http://chrisbateman.github.io/webpack-visualizer/, and you should see this:

TODO: Add Image

Drop the stats.json file you just generated into the drop area, and it will update to look like this:

TODO: Add Image

By hovering over each section of the donut, you'll be able to see the name of each package in your build, and how much of your total build size it's responsible for.