VSCode Emmet for CSS doesn't work with Vue

[onurusluca]

Hi everyone! I am not sure if this is a problem of Volar but just wanted to ask.

Emmet abbreviation auto complete for CSS isn't working for CSS in a Vue(2 and 3 both) isn't working for me.
For example: ml10px should give 'margin-left: 10px;' but it doesn't.

It works normally with .css or .scss files.

I have read every result on this search. Couldn't get it to work.
What may be the problem?

[johnsoncodehk]

Hi @onurusluca, please track #1145.

[onurusluca]

Hi @johnsoncodehk
Thanks. I saw that but there has been no update in over 12 days so I opened a discussion.
Is there anything else I can do?

[johnsoncodehk]

I just one man and I have to resolve higher priority issues first. If you would like to become sponsor, due to guilt I'll raise the priority of your issue. 😅

[onurusluca]

Just confirmed. It is a Volar problem. With Vetur it is fine. Volar is becoming default though. Hope this will be fixed soon. I looked at the code. I will try to fix and request a pull.

For now anyone with the same problem:

• Just disable Volar
• Install Vetur
• Restart all VsCode instances.
• Add these to your VSCode settings.json:

  "emmet.includeLanguages": {
   "vue-html": "html",
   "vue": "html"
    }

I had "vue-html": "html" but it is not enough, had to add both.