[Prettier Plugin] Plugin adds unessessary empty lines #17972

cyrilschreiber3 · 2025-05-10T20:09:15Z

cyrilschreiber3
May 10, 2025

When I enable the prettier-plugin-tailwindcss module, prettier adds empty lines between every element. Which is not the case without the plugin enabled.

Example

Input (basic html boiler plate provided by Emmet in VSCode):

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

Output without the tailwindcss plugin (desired):

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>

Output with the plugin (undesired):

<!doctype html>
<html lang="en">
   <head>

    <meta charset="UTF-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>Document</title>
     </head
  >
  <body></body>

</html>

My .prettierrc file only contains the following:

{
  "plugins": [
    "prettier-plugin-tailwindcss"
  ],
}

You can see that it also does something funny with the </head> end tag

Is this normal ? Am I missing something ?

Thanks in advance

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Prettier Plugin] Plugin adds unessessary empty lines #17972

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 0 comments

Select a reply

[Prettier Plugin] Plugin adds unessessary empty lines #17972

cyrilschreiber3 May 10, 2025

Example

Replies: 0 comments

cyrilschreiber3
May 10, 2025