Using SASS in React
How to use SASS to style a React application
When you build a React application using create-react-app
, you have many options at your disposal when it comes to styling.
Of course, if not using
create-react-app
, you have all the choices in the world, but we limit the discussion to thecreate-react-app
-provided options.
You can style using plain classes and CSS files, using the style attribute or CSS Modules, to start with.
SASS/SCSS is a very popular option, a much loved one by many developers.
You can use it without any configuration at all, starting with create-react-app
2.
All you need is a .sass
or .scss
file, and you just import it in a component:
import './styles.scss'
You can see an example of it working at https://codesandbox.io/s/18qq31rp3.
→ I wrote 17 books to help you become a better developer, download them all at $0 cost by joining my newsletter
→ JOIN MY CODING BOOTCAMP, an amazing cohort course that will be a huge step up in your coding career - covering React, Next.js - next edition February 2025