Install tailwind with React.js

install_tailwind_react.md

install dependencies

yarn add -D tailwindcss postcss-cli autoprefixer 

init tailwind.js file (--full: all options)

npx tailwindcss init tailwind.js --full

create postcss.config.js file in root directory

const tailwindcss = require("tailwindcss");

module.exports = { 
  plugins : [ 
    tailwindcss('./tailwind.js'),
    require('autoprefixer')
  ]
}

create ./src/assets/main.css and ./src/assets/tailwind.css

touch main.css tailwind.css

/* ./src/assets/tailwind.css file */
@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";

package.json

{
  ...
  "scripts" : {
    "start": "yarn watch:css && react-scripts start", 
    "build": "yarn build:css && react-scripts build", 
    ...
    "build:css": "postcss src/assets/tailwind.css -o src/assets/main.css", 
    "watch:css": "postcss src/assets/tailwind.css -o src/assets/main.css"
  }
  ...
}    

add to index.js

import './assets/main.css';