So I'm doing a React App, Where the css files remains on src/dist/css, where src is located in the same local of App.js, the thing is I just want to import one single CSS file, but when I'm going to see every css file were automatically imported somehow.

I want to prevent this, because it's conflicting with the normal css screen.

These are the only things I'm Importing. ( IMAGE )

But All of these are being imported, I don't know if is something with React or the Server.. ( IMAGE )

EDIT: I figured out its because of React Router, Who is importing all the CSS to the App.JS, Still don't know how to prevent this.

CodePudding user response：

There is no way to prevent this. Alternatives that you can look at are:

1. use BEM naming to have no conflicts all over the code.
2. use module.css, CSS module is a simple thing that can help you resolve the conflict without changing much of the CSS you have written.

CodePudding user response：

i recommend you using styled-components or module.css. and tailwind also.