tailwindcss
tailwindcss copied to clipboard
Class detection in Ruby Template files
What version of Tailwind CSS are you using?
v3.3.3
What build tool (or framework if it abstracts the build tool) are you using?
Using vite with v4.4.12
What version of Node.js are you using?
v21.5.0
Reproduction URL
n/a – I can add a repo later for debugging help.
Describe your issue
We are using ViewComponent to manage our HTML templates.
With a ruby template like this:
class FooComponent < ApplicationComponent
def call = tag.span "Foo", class: %w[rounded-full h-0.75 w-0.75]
end
The generated Tailwind styles include rounded-full, h-0.75 but not the w-0.75-class.
When re-arranging the css classes like so:
class FooComponent < ApplicationComponent
def call = tag.span "Foo", class: %w[rounded-full w-0.75 h-0.75]
end
The generated Tailwind styles include include rounded-full, w-0.75 but not the h-0.75-class.
When re-arranging the css classes like so:
class FooComponent < ApplicationComponent
def call = tag.span "Foo", class: %w[w-0.75 h-0.75 rounded-full]
end
The generated Tailwind styles includes all expected classes (rounded-full, h-0.75 and w-0.75).
I’m also having this problem with Phlex components, which are .rb files.
Hey folks! In v3, this is unfortunately a limitation in our approach of how we parse content files for classes. We updated the whole scanning part with the release of Tailwind CSS v4 though where we made sure Ruby templates like this work as expected. I'd recommend you try Tailwind CSS v4 and report a new issue if this is still a problem.
Unfortunately, I don't think we'll be able to backport this change to v3 at this point so I'm going to close this particular issue for now. Thank you!
Fair enough. It works great in v4.