There are even settings for it under HTML Whitespace Sensitivity, but it could never be perfect.

), but I could see it rubbing people the wrong way. You can always fix it with a comment for Prettier to leave it alone (e.g. It can be configured to only auto close after you’ve typed the on purpose like that (no whitespace) because you’re going to set all the list items inline, Prettier will break them onto their own lines, inserting whitespace, and changing the layout of what you intend. This extension shows you UI about what HTML is being closed:Īs soon as you type the > in an HTML element, like the last bracket in, the closing tag is automatically created for you. The whole idea is that rather than you leaving comments in your HTML to indicate what HTML element it is closing (a somewhat common practice, especially for partials that close elements that might not be opened in the same document).

I heard about this one from Stefan Judis who blogged about it the other day and inspired this post idea. It does “HTML Expansions” like this, which I use pretty much every day of my life: HTML End Tag Labels You should know about it though because it’s very useful. I’d start with Emmet here, even thought it’s not technically an extension 1 for VS Code. These are just a handful that I’ve tried and liked to some degree. Maybe some of them don’t appeal to you, solve a problem you don’t have, or feel like more clutter than you need. Let’s look at some extensions for VS Code that make writing and editing HTML (and languages that are basically HTML with extra powers) better.

Visual studio code online web