Adding SASS to create-react-app

 

Installation

In new project, install sass.

    npm i sass

Importing SASS

1. Rename App.css to App.scss. Also index.css to index.scss.

2. In App.js and index.js fix the import from css to scss. It will result:
   
   

    import "./index.scss";

Using SASS

1. You can edit the scss either in App.scss or index.scss

for example, clear all code in app.scss, then add the following:

    $mainColor: #525763; // assigning the variable

    body {

    background-color: $mainColor; // consuming the variable

    }