[Feature request] Automatic whitespace removal

[kachkaev]

Is your feature request related to a problem? Please describe.

When using TailwindCSS, my teammates and I often end up with multiple spaces in the list of classes:

<div className="    flex   w-full space-x-4      items-center ">...</div>

When we apply autofix (tailwindcss/classnames-order), class names are reordered but extra spaces between them are not removed:

<div className="    flex   w-full items-center      space-x-4 ">...</div>

Describe the solution you'd like

I understand that certain teams might want to keep the original spacing, e.g. when someone wants to align class names of different width. However, it’d be great to have an option to auto-remove them:

<div className="flex w-full items-center space-x-4">...</div>

How about a new rule, say, tailwind/whitespace?

Describe alternatives you've considered
I looked around for potential ESLint rules in other plugins but could not find anything that would cover this case. Even if there exists something for className="..." outside eslint-plugin-tailwindcss, that solution would not be ideal. Spaces should be removed from all TailwindCSS-related strings, e.g. inside cn() and other configured functions. So it feels like this rule does belong to this plugin.

Additional context
See #1, which is the original feature request for this behavior. The issue was fixed in 46717c8 but was then discontinued in #126. You can tell this by the removal of a relevant test case.

[kachkaev]

👋 @francoismassart! Would you be willing to a accept a PR for this?

[AndonMitev]

Hey please can we have this PR approved looks like common issue to put extra spaces in classNames

[manyuemeiquqi]

I think it's a good suggestion,i need it.

[stefanofa]

Any update on this?

[kachkaev]

Happy to try a PR if it has chances to get released. The latest commit on master was on Jun 27. I just want to make sure that the repo is actively maintained before investing time in a new rule. WDYT @francoismassart?

[ziyafenn]

Is there no progress on this? Would be a killer feature as tailwind intellisense extension stopped supporting this too.

[kachkaev]

👋 @francoismassart, congrats on a new release and thanks for merging #308! Glad that you’re still looking after this plugin.

WDYT of tailwind/whitespace as a new rule? I can try to create a PR if it has chances of getting released. This issue is the top-voted one at the moment:

[thenbe]

eslint-plugin-unocss has a similar rule (no-excessive-whitespaces) that can be used for inspiration.

[JacobZyy]

Is there no progress on this?