Using CSS Module in Latest React 16.12.0

[It's my first post, so please ignore any grammatical mistake]

In the newer version of reactJS [as per given date 10-FEB-2020 it's 16.12.0], the older way of using npm run eject will not work.

So, to make it work what we can do is ---

Step 1 Making CSS file
While making a CSS file, name it in following convention.
e.g name i want is "index", so instead of naming it "index.css", name it to "index.module.css"
And write css code as usual you are writing earlier.

Step 2 Importing CSS file
While importing the "index.module.css" file in another file, eg in App.js, use following command;

import style from './index.module.css';

style name is upto you, this is used for refering the classes and id inside of css file

for using CSS codes use className={style.Col}
Col is the css code inside index.module.css

Comments

[ANUJ YADAV]

Good, nice explanation bro..

[Kashish Mehta]

Nice

[Sung M. Kim]

Welcome to DEV, Anuj and thank you for the post~