How to setup tailwindcss with create-react-app and SASS.

  1. Create a new react app(duhh!).
 npx create-react-app tailwind-app && cd tailwind-app
npm install node-sass
npm i tailwindcss postcss-cli autoprefixer -D
npx tailwind init --full
touch postcss.config.js
module.exports = {
plugins: [require("tailwindcss"), require("autoprefixer")]
};
@tailwind base;@tailwind components;@tailwind utilities;
"scripts": {
"start": "npm run build:css && react-scripts start",
"build": "npm run build:css && react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"build:css": "postcss src/styles/tailwind.scss -o src/styles/index.scss "
}
Adding custom classes to tailwindcss

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store