ui icon indicating copy to clipboard operation
ui copied to clipboard

tailwind plugin in tailwind config file not working

Open MoritzBru opened this issue 1 year ago • 2 comments

Environment

------------------------------
- Operating System: Darwin
- Node Version:     v20.12.1
- Nuxt Version:     3.11.2
- CLI Version:      3.11.1
- Nitro Version:    2.9.6
- Package Manager:  [email protected]
- Builder:          -
- User Config:      ssr, devtools, modules, eslint, tailwindcss, ui, image, pwa, runtimeConfig, $production
- Runtime Modules:  @nuxt/[email protected], @nuxt/[email protected], @nuxt/[email protected], @vueuse/[email protected], @vite-pwa/[email protected]
- Build Modules:    -
------------------------------

Version

2.15.2

Reproduction

Error happening in nuxt/ui Error not happening with nuxtjs/tailwindcss module only

Description

Adding a tailwind plugin that utilizes arbitrary values does not work via tailwind.config file. It outputs a warning in the console

The class mask-point-via-[3rem_calc(100%-3rem)] is ambiguous and matches multiple utilities.

If this is content and not a class, replace it with mask-point-via-[3rem_calc(100%-3rem)] to silence this warning.

If I provide the same plugin in the nuxt.config, it is working fine there.

I already tested if this is a problem with the nuxtjs/tailwindcss module, but providing the plugin in the tailwind.config file work just fine there. (c.f. second reproduction link)

Can this be an issue with how nuxt/ui is consuming the tailwind config?

Additional context

No response

Logs

No response

MoritzBru avatar May 03 '24 10:05 MoritzBru

This issue is stale because it has been open for 30 days with no activity.

github-actions[bot] avatar Jul 21 '24 01:07 github-actions[bot]

+1, we are having this issue in spacedriveapp/spacedrive with built-in class duration-[50ms].

Edit: Looks like this is a conflict with the tailwindcss-animate plugin: https://github.com/jamiebuilds/tailwindcss-animate/pull/46

iLynxcat avatar Jul 23 '24 01:07 iLynxcat