解决vue3自动导入webStrom报Vue: Cannot find name ref的问题

最近使用create-vue创建vue3项目，为了给代码减负，使用了自动导入。但是编辑器一直提示导入。 项目在创建的时候会生成tsconfig.app.json、tsconfig.node.json、tsconfig.json三个文件。

vite配置

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import vueDevTools from 'vite-plugin-vue-devtools'
import Components from 'unplugin-vue-components/vite'
import AutoImport from 'unplugin-auto-import/vite'
import { TinyVueResolver } from '@opentiny/unplugin-tiny-vue'
import svgLoader from 'vite-svg-loader'

export default defineConfig({
  plugins: [
    vue(),
    vueJsx(),
    vueDevTools(),
    Components({
      resolvers: [TinyVueResolver]
    }),
    AutoImport({
      resolvers:[TinyVueResolver],
      imports:['vue','pinia','vue-router','@vueuse/core','@vueuse/head','@vueuse/math'],
      dts: './auto-imports.d.ts'
    }),
    svgLoader()
  ],
  define: {
    'process.env': { ...process.env }
  },
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    },
  },
})

该配置会在根目录下生成auto-imports.d.ts和components.d.ts文件，如果是使用vscode做代码编辑到此处已经完毕，可以愉快的写代码了，但是本人使用webStrom作为主要开发工具，编辑器一直提示导入，很是不爽。 看了相关文档之后确定在tsconfig.app.json的include下添加类型配置即可。 我的配置tsconfig.app.json

{
  "extends": "@vue/tsconfig/tsconfig.dom.json",
  "include": [
    "env.d.ts",
    "src/**/*",
    "src/**/*.vue",
    "auto-imports.d.ts",
    "components.d.ts"
  ],
  "exclude": ["src/**/__tests__/*"],
    "compilerOptions": {
    "composite": true,
    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",

    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}