How to use LESS preprocessor in React’s create-react-app

Posted on
Using LESS or SASS has become the de facto standard for front end development and React is the preferred frontend framework these days. A question is asked frequently on how we can enable LESS/SASS/STYLUS in React project. The easiest way to do it is using custom-react-scripts. This adds the support for SASS/LESS/STYLUS and decorators in a react app.
  1. Install  create-react-app custom-react-scripts globally
    npm i -g create-react-app custom-react-scripts
    
  2. Create a new react app  create-react-app custom-react-scripts globally
    create-react-app <your_app_name> —-scripts-version custom-react-scripts
    
This will create the app with LESS supported in it. Their are few examples created in the App code which you can explore more to know how to use it. Happy Reacting!!

Leave a Reply

Your email address will not be published. Required fields are marked *