Theme prefix error

[maxdzin]

Environment

• Operating System: Linux
• Node Version: v24.11.1
• Nuxt Version: 4.2.1
• CLI Version: 3.30.0
• Nitro Version: 2.12.9
• Package Manager: pnpm@10.23.0
• Builder: -
• User Config: extends, modules, future, compatibilityDate, experimental, ssr, devtools, css, app, nitro, routeRules, runtimeConfig, ui, colorMode, fonts, i18n, icon, image, site, security, vite
• Runtime Modules: nuxt-security@2.5.0, @pinia/nuxt@0.11.3, nuxt-auth-utils@0.5.25, @nuxtjs/i18n@10.2.1, @nuxtjs/robots@5.5.6, @nuxt/fonts@0.12.1, @nuxt/icon@2.1.0, @nuxt/image@2.0.0, @nuxt/ui@4.2.1, @vueuse/nuxt@14.0.0, @nuxt/eslint@1.10.0, @nuxt/test-utils/module@3.20.1
• Build Modules: -

Is this bug related to Nuxt or Vue?

Nuxt

Package

v4.x

Version

v4.2.1

Reproduction

https://stackblitz.com/edit/github-dbusn1gi

Run in terminal:

1. NODE_ENV=development pnpm install
2. pnpm lint

Description

The latest implementations of the nuxt/ui are so lovely, and I appreciate all the people behind it. You made amazing things!

That's super great that now we are able to set a theme prefix!
It works on dev, but it drops such an error during the linting:

eslint .

Oops! Something went wrong! :(

ESLint: 9.39.1

Error: Cannot apply unprefixed utility class `antialiased`. Did you mean `wb:antialiased`?

Note, I set wb prefix as stated in the docs.

So, there is a problem that some internal module styles are not taken into account when a theme prefix is ​​specified.

Additional context

No response

Logs

eslint .

Oops! Something went wrong! :(

ESLint: 9.39.1

Error: Cannot apply unprefixed utility class `antialiased`. Did you mean `wb:antialiased`?
    at onInvalidCandidate (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/tailwindcss@4.1.17/node_modules/tailwindcss/dist/chunk-MEY3PWYT.mjs:41:461)
    at Ae (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/tailwindcss@4.1.17/node_modules/tailwindcss/dist/chunk-MEY3PWYT.mjs:36:36356)
    at eval (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/tailwindcss@4.1.17/node_modules/tailwindcss/dist/chunk-MEY3PWYT.mjs:41:355)
    at hr (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/tailwindcss@4.1.17/node_modules/tailwindcss/dist/chunk-MEY3PWYT.mjs:23:1718)
    at I (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/tailwindcss@4.1.17/node_modules/tailwindcss/dist/chunk-MEY3PWYT.mjs:23:1377)
    at xe (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/tailwindcss@4.1.17/node_modules/tailwindcss/dist/chunk-MEY3PWYT.mjs:41:172)
    at zi (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/tailwindcss@4.1.17/node_modules/tailwindcss/dist/chunk-MEY3PWYT.mjs:58:294)
    at async Module.Ju (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/tailwindcss@4.1.17/node_modules/tailwindcss/dist/chunk-MEY3PWYT.mjs:58:1577)
    at async oB (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/prettier-plugin-tailwindcss@0.7.1_prettier@3.6.2/node_modules/prettier-plugin-tailwindcss/dist/index.mjs:3531:519)
    at async Object.parse (file:///home/projects/github-dbusn1gi/node_modules/.pnpm/prettier-plugin-tailwindcss@0.7.1_prettier@3.6.2/node_modules/prettier-plugin-tailwindcss/dist/index.mjs:3531:11278)
 ELIFECYCLE  Command failed with exit code 2.

[benjamincanac]

This error happens because of the prettierRecommended plugin inside your ESLint config which loads the prettier-plugin-tailwindcss. Since we just made a fix so Prettier can resolve the #build/ui.css alias to node_modules/@nuxt/ui/.nuxt/ui.css which is the static version, it makes sense the prefix doesn't work there 😬

Adding back this alias was a workaround which we see the limit here. I guess we can't do much here until tailwindlabs/prettier-plugin-tailwindcss#414 is fixed..

[maxdzin]

@benjamincanac, yes, exactly. The same happens when I get rid of eslint-plugin-prettier and just use eslint-config-prettier (to just turn off conflicting rules). Check updated reproduction.
So, when launching pnpm format (which is prettier --write script), it complains about theme alias because of prettier-plugin-tailwindcss.

I guess we can't do much here until tailwindlabs/prettier-plugin-tailwindcss#414 is fixed..
Seems so.

And thank you for looking into this issue.
For now, I just need to turn off that plugin temporarily in prettier config when committing the changes (for lint-staged to pass). This is inconvenient, but I haven't found a better solution yet.