Something is wrong with Emmet in Visual Studio Code

Lukavis picture Lukavis · Aug 14, 2017 · Viewed 21.2k times · Source

After the last update, Emmet is working in some different (incorrect) way.

If I'm typing usual code in Emmet syntax like:

.row>.col*2

and press Tab it's not working.

If I type:

h1{Some title}

and press Tab it's also not working, but if I put the cursor inside brackets, and then press Tab — in this case it's going to work.

This is my Visual Studio Code configuration:

"editor.fontSize": 12,
"editor.wordWrap": "on",
"editor.wrappingIndent": "indent",
"editor.minimap.enabled": true,
"workbench.iconTheme": "material-icon-theme",
"window.zoomLevel": 0,
"window.openFilesInNewWindow": "off",
"window.openFoldersInNewWindow": "on",
"workbench.welcome.enabled": false,
"workbench.colorTheme": "Default Light+",
"[stylus]": {
    "editor.quickSuggestions": {
        "other": false,
        "comments": false,
        "strings": false
    }
},
"emmet.preferences": {
    "stylus.valueSeparator": ": "
},
"git.enableSmartCommit": true

How can I fix it?

Answer

Simon picture Simon · Aug 17, 2017

As of version 1.15.1 this worked for me:

Open up your preferences and add in

"emmet.triggerExpansionOnTab": true

It seems Tab is no longer associated with Emmet.

If you are on v1.33.0 or newer, you can also open up the preferences and type in something like trigger expansion and it's just a simple toggle now. Of course, you can still do the above in the settings.json file as well.