Reduce Tailwind CSS bundle size for unused components #877

benjamincanac · 2023-10-27T09:34:00Z

No description provided.

jrutila · 2023-10-30T06:18:49Z

Related to #802 do you want separate issues on reducing the unused colors (this could be an option parameter, even) and reducing bundle size for unused components?

benjamincanac · 2023-10-30T09:14:44Z

Removing unused colors is already done through Smart safelisting and I already answered here #802 (comment) on how to select only desired colors, not sure why you want to create another issue.

jrutila · 2023-10-30T14:55:14Z

I read the docs and that's what nuxt/ui is trying to achieve. But it doesn't seem to work as intended so I created a bug: #889. We can continue this color discussion there and leave the ticket for the unused component thing.

ronenteva · 2023-10-31T21:15:11Z

Sorry to jump in, but simply adding @nuxt/ui to an empty project creates an inline css of 243kb.
Is that related to this issue or something that I'm missing from the documentation?

benjamincanac · 2023-10-31T21:16:41Z

It is related to this issue, the whole config is taken into account by Tailwind: https://github.com/nuxt/ui/blob/dev/src/runtime/ui.config.ts

jrutila · 2023-11-01T04:10:37Z

Is that ui.config file now available for Tailwind to do it's magic? Or does it do something more in nuxt/ui code? I am trying to scope the fix here.
If nuxt/ui would know which components the dev has used in the code it could cherry-pick those definitions from the config file for Tailwind, right?

divine · 2023-11-01T11:10:01Z

Hello,

This is pretty serious affecting performance.

@atinux can this pushed forward please?

Thanks!

raf202 · 2023-11-01T13:13:03Z

The build size is huge when using Static Site. Weirdly, NuxtUI is adding the tailwind styles inside a <style> tag inside all .HTML files. Is something broken or am I missing something?

ronenteva · 2023-11-07T07:55:39Z

@benjamincanac any timeline for this?
It's labeled as enhancement but I'm sure for many this issue is a deal-breaker for using @nuxt/ui

ineshbose · 2023-11-07T07:57:32Z

Hey! We're researching into this and hoping to come up with a breakthrough soon. 😄

jrutila · 2023-11-07T13:21:26Z

The build size is huge when using Static Site. Weirdly, NuxtUI is adding the tailwind styles inside a <style> tag inside all .HTML files. Is something broken or am I missing something?

@sigmaxf I think this is more of nuxt's features. Try to fiddle with https://nuxt.com/docs/guide/going-further/experimental-features#inlinessrstyles

ineshbose · 2023-11-23T18:34:14Z

There should be a workaround available for this now, if someone would like to report back on this please.

See "Tailwind CSS bundle" section on release notes for https://github.com/nuxt/ui/releases/tag/v2.11.0.

ronenteva · 2023-11-24T07:52:51Z

@ineshbose thanks! your help is highly appreciated!

I've tried excluding everything (on an empty project), and went down from 253kb to 185kb.
Big improvement but still huge for production.

Just to understand the issue, is it not possible to load nuxt ui before cssnano?

Here's what I excluded, if it helps anyone:

      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/data/table.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/accordion.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/alert.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/avatar.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/avatarGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/badge.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/button.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/buttonGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/chip.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/dropdown.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/kbd.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/meter.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/meterGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/progress.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/checkbox.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/radioGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/radio.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/toggle.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/formGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/select.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/textarea.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/selectMenu.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/range.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/input.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/card.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/container.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/divider.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/skeleton.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/breadcrumb.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/commandPalette.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/pagination.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/verticalNavigation.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/contextMenu.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/modal.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/notification.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/notifications.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/popover.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/slideover.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/tooltip.mjs')

jrutila · 2023-11-24T09:34:40Z

@ronenteva have you limited the amount of color entries in the final outcome? It has an impact, too. See #889

ronenteva · 2023-11-24T10:12:03Z

@jrutila thanks! it's now down to 102kb

import colors from 'tailwindcss/colors';
import {resolve} from 'pathe';

export default {
  theme: {
    colors: {
      transparent: 'transparent',
      current: 'currentColor',
      black: colors.black,
      white: colors.white,
      gray: colors.gray,
      red: colors.red,
      green: colors.green
    }
  },
  content: {
    files: [
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/data/table.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/accordion.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/alert.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/avatar.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/avatarGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/badge.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/button.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/buttonGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/chip.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/dropdown.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/kbd.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/meter.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/meterGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/progress.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/checkbox.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/radioGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/radio.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/toggle.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/formGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/select.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/textarea.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/selectMenu.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/range.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/input.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/card.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/container.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/divider.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/skeleton.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/breadcrumb.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/commandPalette.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/pagination.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/verticalNavigation.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/contextMenu.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/modal.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/notification.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/notifications.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/popover.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/slideover.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/tooltip.mjs')
    ]
  }
};

ineshbose · 2023-11-24T13:34:03Z

Just to understand the issue, is it not possible to load nuxt ui before cssnano?

cssnano should include all the styles from NuxtUI after build.

ineshbose · 2023-11-24T13:34:51Z

Let me add another solution to this problem: @nuxtjs/critters

This should remove unused styles from your page, but few things to note - load this module BEFORE @nuxt/ui, and it only works for generate/prerendered pages.

ManasMadrecha · 2023-12-02T04:11:03Z

@ineshbose Will the critters solution work for ssr:false and npm run generate project?

ineshbose · 2023-12-09T15:32:15Z

Will the critters solution work for ssr:false and npm run generate project?

It needs SSR enabled. Rest, you can exclude files from Tailwind content (a for-loop or even a Nuxt module would be quite elegant) for now.

iamrevolver · 2024-02-18T20:38:02Z

How painful it is to look at this in 2024

ronenteva · 2024-02-24T10:02:15Z

@benjamincanac @ineshbose
I'm sorry to bump the issue but I want to make sure you guys understand that anyone who relies on SEO can't afford using @nuxt/ui until this is fully resolved.

ineshbose · 2024-02-24T10:16:39Z

@ineshbose

I'm sorry to bump the issue but I want to make sure you guys understand that anyone who relies on SEO can't afford using @nuxt/ui until this is fully resolved.

Hey! Thanks for pinging - this issue is still in mind. Unfortunately content detection is a tricky part of Tailwind JIT and a component library based on Tailwind would have such limitations. We'll have to come up with some ground breaking stuff to have dynamic content based on import (contributions welcome) which all of TW community would benefit from, but till then we have a workaround available.

ronenteva · 2024-02-26T10:06:13Z

Let me add another solution to this problem: @nuxtjs/critters

This should remove unused styles from your page, but few things to note - load this module BEFORE @nuxt/ui, and it only works for generate/prerendered pages.

Do you mind sharing an example of how to use critters to remove the unused styles?
I couldn't get it to make any difference.

Another workaround is to use nuxt-purgecss and safelist all classes in the components in use.

benjamincanac · 2024-02-26T14:02:16Z

@ronenteva Excluding all of the config files did not do the trick?

ronenteva · 2024-02-27T03:18:59Z

@benjamincanac I stopped using it at some point but I honestly can't remember what wasn't working.
I'll give it another try and let you know.

Update:
I tested again, adding @nuxt/ui to a clean project and excluding all components, still adds 114kb of inline style.

ronenteva · 2024-02-27T05:55:01Z

If dark mode is not needed, you can save another 30k by setting:

nuxt.config.js

  colorMode: {
    preference: 'light'
  }

tailwind.config.js

  darkMode: []

yuzh2001 · 2024-04-27T06:57:32Z

Providing a workaround:

first, build you app and launch it.
curl http://localhost:3000 (for example)
copy the longest <style>line starting as /* tailwind 4.3.1 ...
save it to a seperate css file and upload it to cdn
in nuxt.config.js/ts, set tailwindcss:{cssPath:false}, and in app:{head:{link:{... import the css on cdn

significantly drop from ~700kb to ~160kb

(the 160kb is because another ui library I use.

ralph-burstsms · 2024-07-24T03:32:07Z

Any updates on this? Or is there a way for nuxt ui to only bundle tailwind classes from used nuxt ui components? This defeats the purpose of tailwind.

yuzh2001 · 2024-07-24T03:33:39Z

Any updates on this? Or is there a way for nuxt ui to only bundle tailwind classes from used nuxt ui components? This defeats the purpose of tailwind.

nope.

yuzh2001 · 2024-07-24T03:37:05Z

Any updates on this? Or is there a way for nuxt ui to only bundle tailwind classes from used nuxt ui components? This defeats the purpose of tailwind.

The key problem is that even if you only import the tailwind classes used, it's still a lot of classes considering how many tailwind classes are used in nuxt-ui. There is just no way around.

SSR needs the css embed in the webpage itself rather than importing another css file.
NuxtUI uses a bunch of tailwind classes.

I just gave up. There is little difference between 70kb and 700kb nowadays.

benjamincanac · 2024-07-24T09:20:19Z

The only solution available at this time is to exclude components you're not using as mentioned in #877 (comment). We hope to fix this issue in v3 with the Tailwind CSS vite plugin!

yuzh2001 · 2024-07-24T13:54:54Z

The only solution available at this time is to exclude components you're not using as mentioned in #877 (comment). We hope to fix this issue in v3 with the Tailwind CSS vite plugin!

Having different opinions.
As long as nuxt doesn't change its inline css policy, this problem cannot be fixed.

for better ssr performance, nuxt will inline all style from tailwind.
nuxtui is a huge ui library, it will use ton of css classes.

therefore, this problem cannot be solved.

ralph-burstsms · 2024-07-24T14:24:21Z

Already did excluding components, and the unnecessary colors. That's better now. Thanks!

How about disabling nuxt ui on specific pages, or enabling it on some? So that SSR will only need to render this on specific pages. For example, in my case, i only use Nuxt UI for forms, and i don't need it to load in the homepage, in most of the pages actually.

yuzh2001 · 2024-08-01T16:43:11Z

@benjamincanac The problem comes from safelisting for colors.

Tried it on the minimal playground in this repository, still generates ~250kb.

runtime/utils/color.ts:286 ...safelistByComponent['notification'](colorsAsRegex(globalColors)), import all colors and their alpha-value. If removed, ~100kb. (253Kb -> 159Kb)

runtime/utils/color.ts:283 ...baseSafelist, import primary color with its tons of <alpha-value>. If removed, ~80kb. (159Kb -> 82.19Kb)

I did read the Theming part in documentation and understand the reason for above safe-listing.

However, there should be at least one better way to resolve this problem rather than safelisting them all.

Let's say the user never changed the original colors. Neither add nor remove. At this scenerio, all the safelisting colors can be extracted to an external, precompiled css file. As mentioned above, this will rescue ~180kb.
(not sure if this works) follow the official tailwindcss guide,

Instead, map props to complete class names that are statically detectable at build-time:

Always map props to static class names

function Button({ color, children }) {
  const colorVariants = {
    blue: 'bg-blue-600 hover:bg-blue-500',
    red: 'bg-red-600 hover:bg-red-500',
  }

  return (
    <button className={`${colorVariants[color]} ...`}>
      {children}
    </button>
  )
}

yuzh2001 · 2024-08-01T18:57:01Z

#2005 should fix above problem.

martinholovsky · 2024-09-13T06:44:03Z

@jrutila thanks! it's now down to 102kb

import colors from 'tailwindcss/colors';
import {resolve} from 'pathe';

export default {
  theme: {
    colors: {
      transparent: 'transparent',
      current: 'currentColor',
      black: colors.black,
      white: colors.white,
      gray: colors.gray,
      red: colors.red,
      green: colors.green
    }
  },
  content: {
    files: [
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/data/table.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/accordion.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/alert.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/avatar.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/avatarGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/badge.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/button.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/buttonGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/chip.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/dropdown.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/kbd.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/meter.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/meterGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/elements/progress.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/checkbox.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/radioGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/radio.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/toggle.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/formGroup.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/select.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/textarea.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/selectMenu.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/range.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/forms/input.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/card.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/container.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/divider.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/layout/skeleton.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/breadcrumb.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/commandPalette.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/pagination.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/navigation/verticalNavigation.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/contextMenu.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/modal.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/notification.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/notifications.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/popover.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/slideover.mjs'),
      '!' + resolve('node_modules/@nuxt/ui/dist/runtime/ui.config/overlays/tooltip.mjs')
    ]
  }
};

Have you considered using PurgeCSS to remove zombie classes? https://purgecss.com/guides/nuxt.html

benjamincanac added the enhancement New feature or request label Oct 27, 2023 — with Volta.net

benjamincanac mentioned this issue Oct 27, 2023

[Performance] Why nuxt lab UI cannot pure css? #802

Closed

benjamincanac added the help wanted Extra attention is needed label Oct 27, 2023 — with Volta.net

benjamincanac mentioned this issue Oct 30, 2023

Nuxt/Tailwind generates unnecessary color css definitions on colors that are not used in the project #889

Closed

benjamincanac mentioned this issue Nov 1, 2023

A bulk of tailwind styles is defined within the <style> element of every rendered static .html page #900

Closed

ineshbose mentioned this issue Nov 8, 2023

refactor(config): break ui.config.ts into separate files #930

Merged

8 tasks

benjamincanac mentioned this issue Nov 29, 2023

fix(components): move remaining classes to config #1039

Merged

8 tasks

benjamincanac mentioned this issue Jan 22, 2024

nuxt Using nuxt/ui, the packaged css file is particularly large, is there any optimization method? #1262

Closed

ineshbose mentioned this issue Feb 5, 2024

Why are unused styles not cleared? nuxt-modules/tailwindcss#803

Closed

benjamincanac mentioned this issue Feb 19, 2024

Pulls a huge tailwindcss!(( #1375

Closed

benjamincanac mentioned this issue Mar 4, 2024

v3 #1289

Open

7 tasks

benjamincanac added the v3 #1289 label Mar 9, 2024

yuzh2001 mentioned this issue Aug 1, 2024

fix(module): reduce css bundle size by fixing safelist regex #2005

Merged

8 tasks

benjamincanac removed help wanted Extra attention is needed v3 #1289 labels Aug 2, 2024

benjamincanac closed this as completed in #2005 Aug 2, 2024

davestewart mentioned this issue Aug 7, 2024

Proposal: make gray-* properly themable #2026

Closed

ineshbose mentioned this issue Sep 3, 2024

Migrate to radix-vue #409

Closed

Reduce Tailwind CSS bundle size for unused components #877

Reduce Tailwind CSS bundle size for unused components #877

Comments

benjamincanac commented Oct 27, 2023

jrutila commented Oct 30, 2023

benjamincanac commented Oct 30, 2023 • edited Loading

jrutila commented Oct 30, 2023

ronenteva commented Oct 31, 2023

benjamincanac commented Oct 31, 2023

jrutila commented Nov 1, 2023

divine commented Nov 1, 2023

raf202 commented Nov 1, 2023 • edited Loading

ronenteva commented Nov 7, 2023

ineshbose commented Nov 7, 2023

jrutila commented Nov 7, 2023

ineshbose commented Nov 23, 2023

ronenteva commented Nov 24, 2023

jrutila commented Nov 24, 2023

ronenteva commented Nov 24, 2023

ineshbose commented Nov 24, 2023

ineshbose commented Nov 24, 2023

ManasMadrecha commented Dec 2, 2023

ineshbose commented Dec 9, 2023

iamrevolver commented Feb 18, 2024

ronenteva commented Feb 24, 2024

ineshbose commented Feb 24, 2024

ronenteva commented Feb 26, 2024

benjamincanac commented Feb 26, 2024

ronenteva commented Feb 27, 2024 • edited Loading

ronenteva commented Feb 27, 2024

yuzh2001 commented Apr 27, 2024

ralph-burstsms commented Jul 24, 2024

yuzh2001 commented Jul 24, 2024

yuzh2001 commented Jul 24, 2024

benjamincanac commented Jul 24, 2024

yuzh2001 commented Jul 24, 2024

ralph-burstsms commented Jul 24, 2024

yuzh2001 commented Aug 1, 2024 • edited Loading

yuzh2001 commented Aug 1, 2024

martinholovsky commented Sep 13, 2024

benjamincanac commented Oct 30, 2023 •

edited

Loading

raf202 commented Nov 1, 2023 •

edited

Loading

ronenteva commented Feb 27, 2024 •

edited

Loading

yuzh2001 commented Aug 1, 2024 •

edited

Loading