Using Webpack With React

Question

I suppose this question is about JS bundlers all together and how they interact with React.

When I run Webpack, it grabs all of the libraries, all of the components and merges them into one javascript file (bundle.js).

My question is this. Isn't that a bad thing? All of my components are being loaded even though I won't be using a lot of them for each page.

Let's say I have Register.js that contains the registration form component. Wouldn't this approach to bundling all of this code together make that component load on every single page?

Is that how this works? If so, can I restructure this system with Webpack to not load all of the components on each view?

Matt · Accepted Answer · 2016-01-14 03:34:19Z

1

Webpack offers code splitting and multiple entry points for page-specific loading of modules.

There's a lot of documentation to sift through but the key takeaway is:

The more notable feature is that Code Splitting can be used to split code into an on demand loaded chunk. This can keep the initial download small and downloads code on demand when requested by the application.

answered Jan 14, 2016 at 3:34

Matt

44.1k6 gold badges105 silver badges103 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using Webpack With React

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related