I'm using TypeScript in Vue project.
But when I try to import vue file, I can't get .vue file since the 'cannot find module...' error.
What is weird is that intellisense only shows the directory right upper the .vue file.
Intellisense shows the directory well
But it doesn't show the .vue file inside it
I also have vue-shim.d.ts file in root directory.
You should install TypeScript Vue Plugin and Vue Language Features.
Try adding the following into index.d.ts in the project root, works for now.
declare module '*.vue' {
import Vue from 'vue'
export default Vue
}
or try to configure the path in tsconfig with
"paths": { "@/*":["./src/*"] }
or edit includes in tsconfig with
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
If you are using Vue 3 you should add this into a type file like vue.d.ts:
declare module '*.vue' {
import type {DefineComponent} from 'vue'
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const component: DefineComponent<object, object, any>
export default component
}
You can see it working here: source
declare module '*.vue' { export default never }
In my case the issue is with VS Code. After doing
Shift + CMD + P -> Restart typescript server (Mac)
The lint issue is no more.
For me, following resolved the issue Windows 10:
Focus on any *.ts (preferably for which you are getting error)
CTRL + SHIFT + P -> Restart TS Server
Focus on any *.vue (preferably in which you are getting error)
CTRL + SHIFT + P -> Restart Volar server
I was working on IntelliJ 2023.2.2 and I had the same issue. None of the other solution worked, until I selected "Repair IDE"
