Skip to content

Fix Tailwind CSS build compatibility with proper fallback#511

Open
ssun3 wants to merge 2 commits intoIsawan:uifrom
ssun3:fix-tailwind-v4-minimal
Open

Fix Tailwind CSS build compatibility with proper fallback#511
ssun3 wants to merge 2 commits intoIsawan:uifrom
ssun3:fix-tailwind-v4-minimal

Conversation

@ssun3
Copy link
Copy Markdown
Collaborator

@ssun3 ssun3 commented Jul 5, 2025

Summary

This PR fixes the build process to work with or without Tailwind CSS installed, addressing the v4 compatibility issues.

Changes

  • Added detection for tailwindcss availability with version logging
  • Implemented graceful fallback to pre-compiled CSS on any failure
  • Copy generated CSS to static folder so it gets properly embedded into the binary
  • Preserve the original hashing functionality for future cache-busting features

Key Points

  • The original code was generating hashed filenames but templates use fixed path /ui/static/tailwind.css
  • This fix ensures the CSS ends up where the templates expect it
  • The hashing code is preserved for when dynamic template injection is implemented
  • Tailwind v4 currently has issues with the build command, so we fallback gracefully

Testing

  • ✅ Build succeeds without Tailwind CSS (uses pre-compiled CSS)
  • ✅ Build succeeds with Tailwind CSS v4 installed (falls back to pre-compiled CSS due to v4 issues)
  • ✅ UI loads correctly at http://localhost:9543/ui/
  • ✅ CSS is properly embedded in the binary
  • ✅ Server runs successfully and serves the UI

Build Output

warning: terrashine@0.1.0: Found tailwindcss: ≈ tailwindcss v4.1.11
warning: terrashine@0.1.0: Falling back to pre-compiled CSS due to generation error

This is expected behavior until Tailwind v4 CLI issues are resolved or we update the build commands for v4 compatibility.

ssun3 added 2 commits July 5, 2025 02:01
- Add version detection for Tailwind CSS
- Fallback to pre-compiled CSS when Tailwind CLI is not available
- Update style.css to use Tailwind v4 import syntax
- Document Tailwind CSS v4 requirement in developer guide
- Ensure CSS is properly bundled into the binary

This allows the build to succeed whether or not Tailwind CSS is installed,
while still supporting active UI development when it is available.
- Detect tailwindcss availability and version
- Gracefully fallback to pre-compiled CSS on any failure
- Copy generated CSS to static folder for embedding into binary
- Preserve original hashing functionality for future cache-busting

The build now succeeds in all scenarios:
1. When tailwindcss is not installed (uses pre-compiled CSS)
2. When tailwindcss v4 fails (uses pre-compiled CSS)
3. When tailwindcss succeeds (generates and embeds new CSS)
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