CSS Modules in 30 seconds

Updated on Jan 15, 2018

CSS Modules allows us to write CSS rules that are restricted to a certain part of the UI. It is not an official specification or browser implementation, but rather a process enabled by a build tool like Webpack. In contrast to a regular CSS selector, which can match any element, a CSS Modules selector can only match elements in a specific part of the UI (e.g. in a specific React Component). Build tools accomplish this by transforming the selectors we write into new, globally unique selectors and then applying the new selector to the associated UI element.

Did you find this post useful? Show some love!
DISCUSSION
Classic DEV Post from Apr 25

What's your tech stack?

Photo courtesy of Flickr user kreturn I came across this post from @ben today...

Ross Creighton
Join dev.to

Guaranteed to make you a better developer or your money back