How to autocomplete tag.className in Visual Studio Code like Sublime Text

Question

In sublime Text 2 writing div.panel then press tab, or the auto complete trigger, in the HTML document produces <div class="panel"></div>

I have tried to get the same result in Visual Studio Code version 1.17.1 but I could not able to get it.

I am using the following plugins:

• Auto Close Tag
• HTML CSS Support
• HTML Snippets

Answer 1

settings.json Ctrl + ,

"emmet.triggerExpansionOnTab": true,
"emmet.showSuggestionsAsSnippets": true,
"editor.snippetSuggestions": "top"

Answer 2

In the latest version of vs code, you need to go in seetings using Ctrl+, key and search for Emmet. Tick the checkbox of Emmet: Show Suggestions As Snippets and Emmet: Triger Expansion On Tab and you will be able to use Emmet functionalities.

Answer 3

Add it at setting.json

"emmet.includeLanguages": {
"javascript": "javascriptreact"}

Do not forget to ADD A COMMA at the end of the closing bracket above this code.