Make prettier less uglier - prevent split tags

Question

Prettier in VS Code is great, except in this case where it seems to make things less readable. Here's an example of prettier's wrapping behavior in a Vue template file:

Notice the opening tag's end bracket is placed as start of second line, and closing tag is split between end of line 2 and 3. In my mind, this is more pretty:

Now the tags are complete on their own lines and the content is alone on line 2.

I've been unable to find a way to configure this in the prettier docs. Any ninjas know how?

Answer 1

Try to set htmlWhitespaceSensitivity property to ignore in your prettier config.