-
Notifications
You must be signed in to change notification settings - Fork 494
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Feature Request] UnoCSS #196
Comments
+1 It would increase the customisation possibility |
That was one of my concerns too, but more importantly is that not all unocss configs are available within nuxt.config.ts (like transforms iirc). So this probably requires some work on uno side before we could have it. |
I would LOVE this feature! |
Agree, UnoCSS is better to handle |
https://unocss.dev/integrations/runtime this dont work? using as cdn instead package? example pen: https://codepen.io/antfu/pen/eYGNXGo?editors=1111 |
yea i agree to this one unocss > tailwindcss, a million times. uno offers a lot customization |
Unocss can handle theming itself |
only @antfu can answer this one 😃 |
I did some reading up on supporting uno, I'm not sure it's quite possible to support both unless the module part of this UI was extracted into its own package, and maybe we can have @nuxthq/ui-tw and @nuxthq/ui-uno, and then both share a package that is the actual UI. I spent some time trying to get a clone version going - I have it working locally but when installed as a production module I get errors with sourcemapping: https://github.com/fumeapp/unoui Feel free to help out and PR any fixes/etc, I think what I might need which uno lacks as a module, but tailwind provides, is a hook to extend instead of just making all the configuration at runtime, so i created this: If we can get this working I'll be happy to maintain it as a clone until/if the uno team or nuxt team want to make their own official one. I can put more work into the migration scripts so that updates to this package will be easy to copy/port over. |
I'm just watching the issue but @kidonng could have useful experience from https://github.com/kidonng/unocss-preset-daisy! @antfu might even be willing to offer his suggestion considering how prominent this package is? |
That preset is a bunch of hacks with known issues, and this is given daisyUI is pure CSS and much more simpler than NuxtLabs UI. I'm not saying it's impossible, but it would be hard to avoid PostCSS completely or losing some UnoCSS features/advantages. That said, I may give it a try if I have time. I would not expect a third-party solution to be perfect 😅 |
I did take a look into the codebase. But unfortunately, I think the current approach is coupled too deeply with Tailwind's API, so I guess there may not be a straightforward way to support UnoCSS. I guess doing a fork rewrite (as @acidjazz is doing) might be a more reasonable approach. |
Glad to hear my approach is a good one , feel free to 👀 at unocss/unocss#2786 so I can continue :) |
Hey @acidjazz, is unoui ready to use in production |
Does this mean you cannot use Nuxt UI when using UnoCSS or is there a way to disable Tailwind or use them together? Tailwind doesn't know Uno classes and crashes. |
You can disable default UnoCSS preset and preflight modules: [
'@unocss/nuxt'
],
unocss: {
uno: false,
preflight: false,
icons: true
} |
No, not even close |
Not yet ready for the production nor for announcement but maybe you can check this out 😃 |
Very much looking forward to this. |
Would like to use css agnostic instead of only tailwind or various forks including unocss official support |
This is so sad :/ nuxt/ui#196
Will this be reiterated at some point @benjamincanac ? |
Not really as explained above. What's blocking you with Tailwind CSS? |
Not a blocker per se but Uno "feels" more fun. Choosing Nuxt UI forces you to either choose or Frankenstein them together. Totally reasonable but it'd be "nice" if it were flexible given their similarities. |
I don't know UnoCSS that well but even if we supported both I guess it wouldn't work as we use latest utilities from Tailwind CSS: https://tailwindcss.com/blog/tailwindcss-v3-4. |
currently the Attributify mode since we have most of our codebase written with it. |
Is not this the same attributify mode from UnoCss? I thought uno can be made fully comaptible with tailwindcss through presets. |
So wrap-up, we currently use UnoCSS with attributify mode, once we would like to use Nuxt UI (also with Pro) we will have to switch from UnoCSS to Nuxt tailwind module which doesn't support Attributify mode, so we would have to rewrite all HTML from the attributify mode to standard classes, that's the issue. |
I know this issue is closed, and it is not straightforward. But this is not impossible either. Unocss is very popular in Vue community and interest to this issue shows how much this would be appreciated. For now I have a dilemma for some of my apps either to switch from unocss to tailwind, or to pick a different ui library. The latter is much easier |
Just wondering, how much complex would it be to create a UnoCSS based version?
Why?
The main reason it could be useful is because, when self-hosting, I've noticed that UnoCSS is easier to handle on really small vps/containers (like .25 vCPU).
The text was updated successfully, but these errors were encountered: