Set Up Tailwind Css With create-react-app and yarn

Create a new react project with yarn

yarn create react-app react-tailwind-css-stater

Install Tailwind CSS with postcss & autoprefixer

yarn add -D tailwindcss postcss autoprefixer

Generate tailwind.config.js and postcss.config.js

yarn tailwindcss init -p

Modify tailwind.config.js file

module.exports = {
  content: ["./src/**/*.{js,jsx,ts,tsx}"],
  theme: {
    extend: {},
  },
  plugins: [],
};

Add tailwind base, components and utilities to index.css

@tailwind base;
@tailwind components;
@tailwind utilities;

Categories: