prettier-plugin-tailwindcss

prettier-plugin-tailwindcss copied to clipboard

What version of prettier-plugin-tailwindcss are you using?

v0.6.8

What version of Tailwind CSS are you using?

v3.4.3

What version of Node.js are you using?

v22.3.0

What package manager are you using?

pnpm (first noticed when using npm, though)

What operating system are you using?

macOS

Reproduction URL

tag: https://github.com/happycollision/repro-tw-plugin-problems/releases/tag/over-aggressive-whitespace-removal browse at tag: https://github.com/happycollision/repro-tw-plugin-problems/tree/0b76817425c40fc63874c8c82e6e7e67eb9b3dae

The readme explains the same thing as this issue

Describe your issue

Here's the diff on an example component when you run the plugin:

 export default function Example() {
   const a = "size-12"
   const b = "border border-black"
 
   return (
     <>
-      <div className={a + " p-4 " + b}></div>
+      <div className={a + " p-4" + b}></div>
       <div className={`${a} p-4 ${b}`}></div>
     </>
   )
 }

You can see that the plugin doesn't consider trailing whitespace with +-style concatenation to be important.