Skip to content

Tailwind not seeing classes in Leptos class: attributes #18092

@mondeja

Description

@mondeja

What version of Tailwind CSS are you using?

v4.1.7

What build tool (or framework if it abstracts the build tool) are you using?

@tailwindcss/cli

What version of Node.js are you using?

v22.9.0

What browser are you using?

None

What operating system are you using?

Linux

Reproduction URL

https://play.tailwindcss.com/86oxfAOKhi

Describe your issue

The rustacean framework Leptos has a view! macro that parses HTML-like code to generate components. It accepts the following syntax:

view! { <div class:px-0=true>Whatever</div> }

In Tailwind v3, you can add the next content.transform configuration in tailwind.config.js file to be able to support this syntax:

module.exports = {
  content: {
    files: ["*.html", "./src/**/*.rs"],
    transform: {
      rs: (content) => content.replace(/(?:^|\s)class:/g, ' '),
    },
  },
}

But Tailwind v4 does not support custom transformers.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions