NuxtUI component classes not picked up by tailwind

[roseyda]

Environment

Tested on latest macOS
"@nuxt/ui": "3.0.0-alpha.13",
"nuxt": "^3.15.4"
"packageManager": "pnpm@10.5.0"

Is this bug related to Nuxt or Vue?

Nuxt

Version

3.15.4

Reproduction

Create a new project using nuxt UI starter using :
npx nuxi init -t ui3 <my-app>

Description

Create a new project using nuxt UI starter usiing :
npx nuxi init -t ui3 <my-app>

All tailwind classes used in templates of the project vue files are properly picked up by tailwind.
However, tailwind classes use by nuxt/ui components are picked up by tailwind.

In this div of app/pages/index.vue file, 'gap-2' 'item-center' classes are properly available :

But UButton compenent classes ('font-medium' 'inline-flex'...) are not availble :

Which result in the folowing :

Additional context

tested with pnpm

Logs

No error logged in the console

[Xiradorn]

Hi to all. In the starter project in the main.css file (in alpha-13) there isn't the theme directive for generate css variables (probably in updating). The right code to fix this is:

@import "tailwindcss" theme(static);
@import "@nuxt/ui";

@theme static {
  --font-sans: 'Public Sans', sans-serif;
}

But also with this configuration, i have troubles with the component style as bug report. For example the normal UButton with color primary doesn't work properly

[alexi190]

The issue is in tailwind 4.0.8

"overrides": {
   "tailwindcss": "4.0.7",
   "@tailwindcss/node": "4.0.7",
   "@tailwindcss/postcss": "4.0.7",
   "@tailwindcss/vite": "4.0.7"
 }

fixed it

[roseyda]

Tried @alexi190 solution.
It didn't worked while using pnpm (event after deleting node_module folder)
However, it worked fine using npm

[benjamincanac]

@roseyda With PNPM you can follow this: #3374 (comment)