vite does not build tailwind css

Question

I installed tailwind and other tools using npm install -D tailwindcss postcss autoprefixer vite

I created tailwind and postcss config files using npx tailwindcss init -p

tailwind.config.js contains:

module.exports = {
  content: [],
  theme: {
    extend: {},
  },
  plugins: [],
}

postcss.config.js contains:

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}

My CSS file exits in css ailwind.css and contains:

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

The CSS file is linked to my HTMl page using

When I run vite, my app starts without build errors but tailwind output is not generated.

user_13604352 · Answer

You need to adjust a few settings, feels like you're pretty close.

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

// Open terminal
npm run dev

Testing