Automatic double quotes after '=' in Visual Studio Code when adding attributes in html

Question

Whenever I add attributes to HTML elements like class or id, VSCode automatically inputs two double quotes right after I type =, for example:

<div class='modal-header' id=""></div>

I prefer single quotes in my attributes, so I have to delete the automatically added double quotes every time.

Where can I tweak this feature?

Thanks!

Answer 1

Seems like vscode has recently implemented a feature that auto-inserts quotes into html if you type something=.

I was struggling the last few days over and over again because my finger memory is so used typing in the opening quote manually. I always ended up with something like class=""button or id=""stuff"". Not cool.

Anyways, I found the setting that can control it. Search for html.autoCreateQuotes and disable it. Then you'll have to type the opening quote manually and it will work with single quote too.

If you actually like the feature and want it to insert single quotes, change the setting html.completion.attributeDefaultValue.

Answer 2

You can change it to single quotes in >File >Preferences >Settings >Search

html.completion.attributeDefaultValue

and set the dropdown to

singlequotes