✨
[Vue & VS Code] Emmetの補完のやつがでてこない問題と解決策
Emmetの補完のやつがでてこない
Emmet abbreviationが正式名称ですかね?
vscodeのhtmlの補完のやつと呼んでいて正式名称がわかんない...
何はともあれ出てこない...
普通、vscodediv
とかa
とかh
とか入れるとリストで補完が出てくると思うんですが、
vueで久々開発しようとしたら出てこなくて発狂しました。
試したこと
ネットの情報を漁っていると以下のような設定をsettings.jsonに書けば良いと書いてあるんですが、それでも動かず...
"emmet.includeLanguages": {
"vue-html": "html",
"vue": "html",
},
"emmet.syntaxProfiles": {
"vue-html": "html",
"vue": "html",
},
うまくいった解決策
Vue 3から推奨されているVolarの拡張機能の設定の問題でした。
拡張機能の設定に入って...
下の方までいって...
Vue › Server › Petite Vue: Support HTML File
にチェックをいれる
動くようになりました!
!とかdiv.containerみたいなEmmetは普通に効くので、多分Volar的にはEmmetを制限したほうが書きやすいということなんでしょうね。
自分的にはあれが出ないとしっくりこないので、出てほしいです。
実はそんなに使ってないのですが笑
settings.jsonに直書きする場合
下の一文をsettings.jsonに追記するだけでもいけると思います。
"vue.server.petiteVue.supportHtmlFile": true,
以上です。
Discussion