vetur VS volar

If you use the Vetur extension for Vue language features, you are out of luck. There is a long-standing request for adding this behaviour to Vetur.

The first step is to enable the Volar extension and disable the Vetur extension. Volar is the new recommended extension to use with Vue 3 and typescript.

Volar is supposed to be the upcoming replacement for Vetur, the Vue.js lsp server. It looks like it's significantly better than Vetur; has anyone tried it in lsp-mode in emacs?

There is a known bug in Vetur, the Vue VSCode extension, where it takes forever (sometimes several minutes!) to lint Vue files on save.

Now, we can create regular ol' Vue SFCs, or single file components. By creating the whole component in one file, we get the flexibility of thinking of our components as one functional unit made up of HTML, JavaScript, and CSS. We can also write components in TypeScript or SASS if we want to. We can also get syntax highlighting since SFCs end up being fundamentally HTML documents. And with VSCode plugins like (Vetur)[https://vuejs.github.io/vetur/], development in SFCs has a lot of benefits going for it.

You didn’t give much info, but from what I can tell from your screenshot you are writing in Vue and therefore are probably using Vetur. In that case the only info I could find was an issue from 4 years ago that seems to say you should just turn off style validation.

Vetur - Vue tooling for VS Code

Thanks man! Had the same issue and the plugin is indeed causing it. They just released an update (1.0.1) with a fix: https://github.com/johnsoncodehk/volar/blob/master/CHANGELOG.md

🦾 Full TypeScript Support and intellisense for Vuetify 2 components, powered by Volar

Worth mentioning, Volar, the Vue extension for VSCode, implements type checking as JSX just like Svelte.

Hi, I used this config from Volar's GitHub, but whenever I try to do `so %` it gives me an arror

FYI it’s kind of broken at the moment, i had to downgrade. GitHub Issue

With the release of the official version of Vue3, the Vue team officially recommends the Volar extension to replace the Vetur extension, which not only supports Vue3 language highlighting, syntax detection, Also supports TypeScript and type checking based on vue-tsc.