Search code examples
tailwind-csstailwind-ui

No utility classes were detected in your source files ,double-check the `content`


I am trying to setup tailwind 3 , but i got the next warning .

No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.

this is my project structure

|_public : 
 |_index.html , 
 |_output.css  // this css file generated after i run the command | npx tailwindcss -i ./src/input.css -o ./public/output.css --watch
|_src
 |_input.css

tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./src/**/*.{html,js}"],

  theme: {
    extend: {},
  },
  plugins: [],
}

Solution

  • According to your code, your html files are in the src folder (and sub-folders)

    • Put your html files in the public folder and properly link it with output.css
    • Then run npx tailwindcss -i ./src/input.css -o ./public/output.css --watch

    You can also clone the Tailwind boilerplate I made using

    git clone https://github.com/abrahamebij/tailwind-boilerplate

    Then npm install and npm run css