Skip to content

Upgrade Tailwind CSS from v3 to v4#21

Merged
swilla merged 2 commits intomainfrom
tailwind4-dependency-update
Apr 14, 2026
Merged

Upgrade Tailwind CSS from v3 to v4#21
swilla merged 2 commits intomainfrom
tailwind4-dependency-update

Conversation

@swilla
Copy link
Copy Markdown
Member

@swilla swilla commented Apr 14, 2026

Summary

  • Replace tailwindcss v3 with v4 + @tailwindcss/cli + @tailwindcss/postcss
  • Remove @awcodes/filament-plugin-purge — Tailwind 3 only, no v4 equivalent
  • Remove autoprefixer and postcss-import — both built into Tailwind 4 via Lightning CSS
  • Delete tailwind.config.js — Filament 4 ships no tailwind preset; Tailwind 4 uses CSS-based config instead of JS config
  • Update postcss.config.cjs to use @tailwindcss/postcss plugin
  • Update resources/css/index.css with @source and @plugin directives for Tailwind 4
  • Replace deprecated npm-run-all with npm-run-all2
  • Fix CSS output filename: skeleton.cssfilament-library.css (matches what ServiceProvider looks for in resources/dist/)
  • Bump prettier v2→v3, prettier-plugin-tailwindcss v0.1→v0.6, esbuild v0.19→v0.25

Context

This package supports Filament 4 and 5, both of which use Tailwind 4. The previous tailwind.config.js referenced vendor/filament/filament/tailwind.config.preset, which does not exist in Filament 4 (confirmed: Filament 4 uses @import 'tailwindcss' source(none) in CSS). The entire v3 build toolchain was broken for the current Filament versions.

Test plan

  • Run npm install to verify all packages resolve
  • Run npm run build to verify CSS and JS build without errors
  • Confirm resources/dist/filament-library.css is generated by the build

🤖 Generated with Claude Code

swilla and others added 2 commits April 14, 2026 09:04
- Replace tailwindcss v3 with v4 + @tailwindcss/cli + @tailwindcss/postcss
- Remove @awcodes/filament-plugin-purge (Tailwind 3 only)
- Remove autoprefixer and postcss-import (built into Tailwind 4)
- Remove tailwind.config.js (Filament 4 has no preset; v4 uses CSS-based config)
- Update postcss.config.cjs to use @tailwindcss/postcss plugin
- Update index.css with @source and @plugin directives for Tailwind 4
- Replace deprecated npm-run-all with npm-run-all2
- Fix CSS output filename: skeleton.css → filament-library.css (matches ServiceProvider)
- Bump prettier v2→v3, prettier-plugin-tailwindcss v0.1→v0.6, esbuild v0.19→v0.25

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Matches the filename the ServiceProvider checks for in resources/dist/.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@swilla swilla merged commit 34018d0 into main Apr 14, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant