I only noticed this new version when the prettier-vscode extension was silently upgraded and all of a sudden my HTML templates only have two or three elements per screenful (okay, a slight exaggeration) because the CSS classes are broken into many lines, and being a Tailwind user, each element tend to have many classes. A ~60-line Tailwind UI pagination component[1] is now a whopping ~240 lines:
> For layout frameworks such as Bootstrap and Tailwind CSS, which add many classes to an element, this is important for readability and maintainability vs. the previous behavior (keeping all classes on one line) or e.g. putting each class on its own line.
I don't know how many people find it more readable to have ten lines per opening tag and many screenfuls for any slightly nontrivial structure; certainly not me. I do know the feature was merged "despite the low interest from the community".[2] Worst of all, it is not configurable.
Here's hoping this misfeature can be reversed if there's enough community pushback.
1 comment
[ 4.2 ms ] story [ 12.4 ms ] thread> For layout frameworks such as Bootstrap and Tailwind CSS, which add many classes to an element, this is important for readability and maintainability vs. the previous behavior (keeping all classes on one line) or e.g. putting each class on its own line.
I don't know how many people find it more readable to have ten lines per opening tag and many screenfuls for any slightly nontrivial structure; certainly not me. I do know the feature was merged "despite the low interest from the community".[2] Worst of all, it is not configurable.
Here's hoping this misfeature can be reversed if there's enough community pushback.
[1] https://tailwindui.com/components/application-ui/navigation/...
[2] https://github.com/prettier/prettier/pull/7865#issuecomment-...