Search code examples
prettier

Disable prettier for Tailwind classes

I really want to use Prettier but i get alot of extra lines of code because I also use Tailwind and Prettier formats every class on a new line.

Can I disable this?

Solution

  • Yes, as per prettier documentation, in an html file you can ignore the entire elemenent, all atributes or an specific attribute (which seems to be what you want)

    <!-- prettier-ignore -->
<div         class="x"       >hello world</div            >

<!-- prettier-ignore-attribute -->
<div
  (mousedown)="       onStart    (    )         "
  (mouseup)="         onEnd      (    )         "
></div>

<!-- prettier-ignore-attribute (mouseup) -->
<div
  (mousedown)="onStart()"
  (mouseup)="         onEnd      (    )         "
></div>

    Take a look at the documentation regarding ignoring parts of the code with prettier as the way and scope of ignoring may change depending on the file type.

    Prettier Ignoring code documentation