Vue3 TS: All global compnents throw "JSX element type '__

Every globally registered component has a red typescript squiggle in markup! The app still runs, like there are no errors!

It happens on all components, custom made AND third party libs.
It does NOT throw an error if I import them directly into the vue file.

Boring example of registering a component

//main.ts
import MyComponent from "./components/MyComponent.vue";
_app.component(MyComponent,  "my-component");

Boring usage

//SomeView.vue
< script setup lang="ts>
import OtherComp from "./components"
</script>

<template>
  <div>

    <my-component> 
      <!-- Red Squiggles! -->
    </my-component> 

    <OtherComp> 
      <!-- no error on local import-->
    </OtherComp> 

  </div>
</template>

What the heck is going on? Did I accidentally update typescript or Volar or a linter or something? It's a fake error, right? Sure is ugly.

CodePudding user response：

This error comes from Vue Language Features (Volar).

issue page

Rolling back the volar plug-in to version 0.36.1 can solve this problem.

CodePudding user response：

Just change the volar version 0.37.2 to 0.36.0 and everyting will be fine.

Note: I spent coulple of hours and didn't find the exact solution and then simply tried this; then everything worked fine.

This link helped to get some idea regarading this issue: https://github.com/microsoft/TypeScript/issues/28631#issuecomment-472606019