解决tsx组件中 JSX.IntrinsicElements 接口不存在的报错

Vue3官网通知
搜索关键字：JSX 类型推断​
与变换类似，Vue 的 JSX 也需要不同的类型定义。

从 Vue 3.4 开始，Vue 不再隐式注册全局JSX命名空间。要指示 TypeScript 使用 Vue 的 JSX 类型定义，请确保在 中包含以下内容tsconfig.json：

json
{
“compilerOptions”: {
“jsx”: “preserve”,
“jsxImportSource”: “vue”
// …
}
}
/* @jsxImportSource vue */您还可以通过在文件顶部添加评论来选择加入每个文件。

如果有代码依赖于全局命名空间的存在，则可以通过在项目中JSX明确导入或引用来保留确切的 3.4 之前的全局行为，从而注册全局命名空间。vue/jsxJSX

vite.config.ts中必不可少的插件：
import vueJsx from ‘@vitejs/plugin-vue-jsx’
plugins: [vue(), vueJsx(), viteCompression(), vueDevTools()],

然后报错的问题就解决了，这样就可以正常展示你写的选项式组件啦！