React CSS is duplicated

Question

I have a problem where all of the CSS (style tags) output in my React app are duplicated. The picture below shows an example of the duplication. I have included a copy of my webpack.config.js file here: https://paste.ubuntu.com/p/mdv5Z9bB9v/. I have no idea what's causing this and would love some suggestions for ways to debug this.

Please let me know if any other info is needed!

Can you show the js file for the element this css applies to? — Shmili Breuer
– Shmili Breuer, Commented Mar 9, 2020 at 14:30
100% of the site's CSS is duplicated, but here is one of the components (the only place which uses the h2.welcome that you see above): paste.ubuntu.com/p/4x757by67H — Goulash
– Goulash, Commented Mar 9, 2020 at 14:50

Goulash · Accepted Answer · 2020-03-11 15:20:51Z

1

The problem was that I was importing the bundle.js file in the HTML, although it is added automatically by the webpack, therefore all of the components were being imported twice and hence the CSS was duplicated.

This solution came from here: https://github.com/webpack-contrib/style-loader/issues/143

answered Mar 11, 2020 at 15:20

Goulash

3,8867 gold badges33 silver badges51 bronze badges

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

Collectives™ on Stack Overflow

React CSS is duplicated

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