Tip 1. Ts.vueType declaration corresponding to the file type

After initializing the project with Vite, open it in vscodemain.tsThe file will appear:

The module ‘./ app.vue ‘or its corresponding type declaration could not be found. ts(2307)

I searched online, and the general solutions are all felt to be for the Vue2 scenario:

declare module '*.vue' { import Vue from 'vue'; // Vue3 does not export Vue by default. }Copy the code

A. Vue file type declaration can be defined in any d.ts file. The main question is what type needs to be exported? The simple idea is: see where the.vue file is used.

inmain.tsThe imported App is used forcreateAppThe function imported from app.vue iscreateAppThe first argument to the function, so its App type should becreateAppThe type of the first argument to the function:It can be easily located with vscode (command + click createApp to enter its type declaration file)createAppThe first argument to the function is of typeComponent“, so just find a place that happens to have a projectvue-app-env.d.tsType declaration file, so add the following code:

declare module '*.vue' {
  import { Component } from 'vue'
  const mod: Component
  export default mod
}
Copy the code

This solves the problem of Vue file type files not being found.