Vue2 - VLS throwing errors

[michalsnik]

I'm trying to use this plugin in Vue 2.

Typescript checker works as expected, however when I install and enable vls in config - I'm getting bunch of errors pointing at <template> tags in each component, for example:

• ERROR(VLS) Duplicate identifier '(Missing)'.
• ERROR(VLS) Cannot find name '__vlsRenderHelper'.
• ERROR(VLS) Cannot find name '__vlsComponentData'.
• ERROR(VLS) 'this' implicitly has type 'any' because it does not have a type annotation.
• ERROR(VLS) Argument of type '{ props: { msg: string; }; on: {}; directives: never[]; }' is not assignable to parameter of type '__vlsComponentData__hello_world<Record<string, any>, any> & ThisType'

This happens even in brand new project created via Vite (vue-ts). The only thing I'm changing in original boilerplate is the vite plugin for vue, vue version, adding vue-template-compiler, plus ofc updating components to use options API.

Does anyone have an idea what might be causing such behavior?

[michalsnik]

Interestingly, I also tried using vue-tsc with Vue 2, and itself it works when you additionally install @vue/runtime-dom, but when I enable vueTsc in this plugin - it doesn't report anything 🤔

[fi3ework]

I encountered this issue recently. I don't quite understand what caused it but I did some changes to eliminate the issues.

1. use typescript of ~4.3.2
2. Add a vetur.config.js of following configuration

// vetur.config.js
/** @type {import('vls').VeturConfig} */
module.exports = {
  // **optional** default: `{}`
  // override vscode settings
  // Notice: It only affects the settings used by Vetur.
  settings: {
    'vetur.useWorkspaceDependencies': true,
    'vetur.experimental.templateInterpolationService': true,
  },
}