Cannot find module ts(2307)

[jclijmans]

I have a custom module created in a vite/vue-create project with the vue3 composition setup syntax.
When ever I try to import that component in a normal index.ts file, I get error ts(2307) "Cannot find module './validated-input.vue' or its corresponding type declarations.ts(2307)"

In file validated-input.vue

<template>
    ....
</template>

<script lang="ts" setup>
   ...
</script>

In file index.ts in same folder

import ValidatedInput from "./validated-input.vue";
export { ValidatedInput };

The import of the component in index.ts gives the error. It doesn't seem to recognize the component.

vue-tsc --noEmit doesn't seem to give an error for index.ts

• Vue Language Features (Volar) v0.34.5
• Typescript Vue Plugin (Volar) v0.34.5
• Vue 3 : v3.2.31
• Typescript : 4.6.3

It must be be something that got into one of the latest releases, because I've just noticed that i even get this error in main.ts on the import of App.vue.

To reproduce it:

• start a new project with npm init vue@latest
  • included typescript
• run npm install
• run npm run lint
• open the code in vscode.
  And now there is an error in main.ts for the import of App.vue
  npm run typecheck does not give an error.

[johnsoncodehk]

You could use take over mode instead of TS plugin to avoid this problem for now.

[jclijmans]

Thanks for your reply.
I've tested it and indeed in "Take over mode", the problem is gone.

Will this be fixed in the "regular" typescript mode?
Again thanks for your work.

[johnsoncodehk]

I will fix TS plugin in next version.

[jclijmans]

Cool!! thx

[rodrigocfd]

For those who landed on this page, like me, here's how you set the "takeover" mode in your VS Code:

https://vuejs.org/guide/typescript/overview.html#volar-takeover-mode