TailwindFormatter - Opinionated tailwind class sorter for HEEx templates

Your Libraries & OS Mentoring Libraries
2

Nice work.

For guys don’t like extra deps, and want to sort classes and group classes manually, you can do something like this:

<body class={[
  "h-screen overflow-hidden",
  "bg-gray-300",
  "select-none"
]}>
  <%= @inner_content %>
</body>

A: Why do you group classes?
B: Because I want to seperate the concerns, like:

  1. Positioning
  2. Box model
  3. Typographic
  4. Visual
  5. Misc

This idea comes from Code Guide by @mdo.

7 Likes