Simple guide to adding normalize.css to create-react-app

normalize.md

1. Install normalize.css via npm

npm install --save normalize.css

1.1 Or yarn

yarn add normalize.css

2. Import it to your root .js file before your css styles

import 'normalize.css';

Make sure to add the correct loader to your webpack file: https://stackoverflow.com/questions/42119878/how-to-use-normalize-css-using-npm-install-with-webpack

Just import this inside the index.css:

@import-normalize;

https://create-react-app.dev/docs/adding-css-reset/

Just import this inside the index.css:

@import-normalize;

https://create-react-app.dev/docs/adding-css-reset/

how can do it if i'm working with scss?

@aljorgevi
I think this should work too. I don't use scss directly, so I can't be sure.

Just import this inside the index.css:

@import-normalize;

https://create-react-app.dev/docs/adding-css-reset/

I got this error when using above code in index.css

Unknown at rule @import-normalize css(unknownAtRules)

Unknown rule for normalize seems to be a recurring theme.
There are some work-arounds:

facebook/create-react-app#9710 (comment)

about to try this.

goodluck x

hoe can i import it if I use Styled components?

i write @import-normalize; but not worked!

It doesn't work, Ant design styles is above normalize.css

Just import this inside the index.css:

@import-normalize;

https://create-react-app.dev/docs/adding-css-reset/

I got this error when using above code in index.css

Unknown at rule @import-normalize css(unknownAtRules)

I also have the same IDE error but it does work for me at least.
When I inspect an element in the Dev tools it detects and applies the normalization

Just import this inside the index.css:

@import-normalize;

https://create-react-app.dev/docs/adding-css-reset/

I got this error when using above code in index.css

Unknown at rule @import-normalize css(unknownAtRules)

Tip: If you see an "Unknown at rule @import-normalize css(unknownAtRules)" warning in VSCode, change the css.lint.unknownAtRules setting to ignore

Directly from https://create-react-app.dev/docs/adding-css-reset

use @import "normalize.css/normalize.css" instead @import-normalize;

OtlichnikSasha

Thanks