Menu
I am starting to use Visual Studio Code for my web projects and I cannot live without Emmet, but I have a problem when I try to expand the abbreviations in HTML tags with attributes.
Just an example. If I write html:5 and press TAB key it expands all the HTML5 template
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
</body>
</html>
And writing tags with id and class, like p#id.class, it generates properly next piece of code
<p id="id" class="class"></p>
But when I want to expand same tag with other attributes inside of square brackets, it doesn't work. Just add a tab space in the code.
p[align="center"]
And same thing if I try to add text in the tag using curly brackets
p{Test}
Can you help me to know how to configure it, or if it is a problem with my software / extensions?
Regards,
263
After few days, investigating in the Emmet in Visual Studio Code webpage I found the solution.
You need to add next line to the User Settings file for expanding the Emmet abbreviations with Tab key:
"emmet.triggerExpansionOnTab": true
This is because by default is disabled on Visual Studio Code.
108
In Visual Studio Code: File > Preferences > Settings > Extensions > Emmet > Edit in settings.json file
Add the below code which worked for me.
"emmet.triggerExpansionOnTab": true,
"files.associations": {"*html":"html"},
I hope it helps someone.
44
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
