react-scripts-cssmodules
Adds CSS Modules to Create React App.
How to use
Either create a new project using
create-react-app my-app --scripts-version react-scripts-cssmodules
or within your existing project uninstall react-scripts
and install react-scripts-cssmodules
.
Using CSS and CSS Modules
To import as regular css, do the same as in CRA. import mystyles.css
To import as css modules, rename the file to [name].module.css
and the use as normal css modules.
Example
Button.module.css
another-stylesheet.css
Button.js
;; // Import regular stylesheet; // Import css modules stylesheet as styles { // You can use them as regular CSS styles return <div className=stylesbutton />; }
exported HTML
No clashes from other .button
classnames
Versioning
This package is 10:1 with Create React App. E.g. v1.1.50 of this package is the same as and interchanable with v1.1.5 of Create React App.
Any additional numbers are fixes for this app only. E.g. v1.1.51 is v1.1.5 of React App with a fix only for cssmodules.
See this CRA Issue for more details, or for a more indepth guide check out this article.