Creating Multiple Bundles for Multiple Pages with Webpack - Ep. 7

Published: 18 January 2017
on channel: Chris Courses

20,458

316

🚀View more development courses and content at https://chriscourses.com/

Typically, webpack will store our code in one big bundle which can be good because it decreases the amount of requests made to our server—however—if we’re putting everything into one file, we’re forcing the user to load excess code that the page may not need in order to function.

So how do we make use of module bundling while still creating specific scripts for specific pages? The answer is having multiple entry points that compile into multiple bundles. In this tutorial, I’ll teach you exactly how to implement this using web pack.

Timeline:
0:10 - Why we’d want to create multiple bundles
0:32 - Project overview
1:14 - Adding multiple entry points
2:20 - Using webpack to compile multiple bundles
3:36 - Adding bundles to our HTML
5:21 - Outro

Resources:
https://webpack.github.io/docs/multip...

Beatz:
Immortal Beats - Oh Wee - Creative Commons

For updates on the progress of chriscourses.com and future videos, join the Chris Courses mailing list at http://chriscourses.com.

Support Chris Courses Through Patreon:
--------------------------------------
  / chriscourses

Chris Courses Social:
---------------------
Twitter:   / chriscourses
Facebook:   / chriscourses
Instagram:   / chriscourses

Christopher Lis Social:
-----------------------
Twitter:   / christopher4lis
CodePen: http://codepen.io/christopher4lis