How to fix TailwindCSS not working with Vite + React
Wahid

Wahid @abdulwahidkahar

About: Writing about the mistakes I made in software development and the solutions I found to overcome those challenges.

Location:
Indonesia
Joined:
Nov 12, 2023

How to fix TailwindCSS not working with Vite + React

Publish Date: Dec 27 '24
4 0

Tailwind CSS requires two key configuration files: tailwind.config.js and postcss.config.js. If you don't run npx tailwindcss init -p, these files won't be generated, which can cause issues with Tailwind not working correctly.

  • Missing tailwind.config.js: Without this file, Tailwind can't process your files or customize the framework.
  • Missing postcss.config.js: PostCSS won't be set up, causing Tailwind's utilities to not be compiled correctly.

Solution:
Run

npx tailwindcss init -p
Enter fullscreen mode Exit fullscreen mode

to generate both files. This ensures proper configuration and PostCSS setup, allowing Tailwind to work as expected.

Comments 0 total

    Add comment