CSS loader and Extract Text Plugin Use Case Webpack

Question

I understand that CSS-loader just modularizes your CSS so that if you import style.css in your foo.js, whenever foo.js gets run, it has a reference to style.css such that your elements created in foo.js can then have the hashed classNames of style.css. Then style loader is usually used to putstyle.css into a <style> tag on your html so that the styles get applied.

I'm not sure what the point of Extract Text Plugin. Is it so that you don't need Style Loader and then you can extract all your css into a file and then link to it yourself by manually putting in the name in your html?

Agney · Accepted Answer · 2018-03-04 02:24:36Z

1

From the documentation:

It moves all the required *.css modules in entry chunks into a separate CSS file. So your styles are no longer inlined into the JS bundle, but in a separate CSS file (styles.css). If your total stylesheet volume is big, it will be faster because the CSS bundle is loaded in parallel to the JS bundle.

answered Mar 4, 2018 at 2:24

Agney

19.3k7 gold badges60 silver badges76 bronze badges

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

Collectives™ on Stack Overflow

CSS loader and Extract Text Plugin Use Case Webpack

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related