tailwindcss v4.3.0 not working with vite v8.0.14

[kalcodes]

I'm trying to setup a project using tailwindcss and vite, I followed the official setup guide from the docs. But after the configuration the styles that should've been applied due to utility classes are not being applied but the base styles are rendered, like margin: 0; padding: 0; ...etc. Please help!

The exact steps I took were

$ mkdir tailwind
$ cd tailwind
$ pnpm init
$ pnpm add vite tailwindcss @tailwindcss/vite

# configured packages.json
# added a test code to index.html

$ pnpm dev

[wongjn]

Consider checking:

• Consider checking you've done a git init in the root folder of the project. Tailwind uses git ignore rules internally for automatic source detection. If you have a .gitignore (or equivalent) higher in the directory tree, this may cause Tailwind to ignore files. Initializing a git repo creates a boundary to this.
• Tailwind has compiled since you added the classes.
• String concatenation/interpolation is not used to build class names.
• The class names would resolve to Tailwind classes that Tailwind would generate a rule for.

Otherwise, consider providing a project that reproduces the unexpected behavior.

[kalcodes]

The utility styles with the class names don't exist when looking from the devtools, may tailwind is not compiling for some reason. Also initializing a git repo didn't change anything.

Here is a link to a repo: https://github.com/kalcodes/tailwind-test

[wongjn]

Uncomment the Tailwind plugin in vite.config.js:

--- a/vite.config.js
+++ b/vite.config.js
@@ -2,5 +2,5 @@ import { defineConfig } from "vite";
 import tailwindcss from "@tailwindcss/vite";
 
 export default defineConfig({
-//   plugins: [tailwindcss()],
+  plugins: [tailwindcss()],
 });