Integration of tailwind css with react application

 steps

1)  open termianl create react app with npx create-react-app command

2) then install packages with following command

 npm i -D tailwindcss postcss-cli autoprefixer

3) then create tailwind config file , with following comman

npx tailwind init tailwind.js  --full

4) create post css config file with following command

 touch postcss.config.js

5) then finally put follwing code in post css config file

const tailwindcss=require('tailwindcss')

module.exports={

plugins:[

tailwindcss('./tailwind.js'),

require('autoprefixer')

]

}

6) then create assests folder and inside it create main.csss and tailwind.css file

7) then in tailwind.css file place the following code

8) place following code in package.json

9th step final in package.json file

9 th step "start": " npm run watch:css && react-scripts start",

"build": "npm run build:css &&react-scripts build",

8th step snipets "build:css":"postcss src/assests/tailwind.css -o src/assests/main.css",

"build:watch":"postcss src/assests/tailwind.css -o src/assests/main.css"

7th step snipet @import "tailwindcss/base";

@import "tailwindcss/components";

@import "tailwindcss/utilities"