astrolicious / astro-tips.dev

The place for content that goes beyond the official docs, for all Astronauts!

Home Page:https://astro-tips.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Tailwind v4 setup issue

djmtype opened this issue · comments

Given Tailwind's example of ignoring certain props, this still includes all colors regardless when css.transformer: lightningcss.

/* global.css */
@import "tailwindcss";
@theme {
  --color-*: initial;
}

Astro Config:

import { defineConfig } from "astro/config"
import tailwindcss from "@tailwindcss/vite"

export default defineConfig({
  site: "http://localhost:4321",
  vite: {
    plugins: [tailwindcss()],
    css: {
      transformer: "lightningcss",
    },
});

Therefore, if I remove css.transformer: "lightningcss", Tailwind will obey and not include its colors. However, then I can't take advantage of Lightning's transformers.

@djmtype Sorry for answering late. We just looked at your issue, and can't reproduce it anymore, maybe there was a new update for the @tailwindcss/vite dependency. If it is still not resolved, could you please add a minimal reproduction example. Thanks ❤️