tsx components type declaration support #669
Description
Clear and concise description of the problem
使用如下配置：
import { VantResolver } from 'unplugin-vue-components/resolvers'; import Components from 'unplugin-vue-components/vite'; export const configComponents = () => { return Components({ extensions: ['js', 'jsx', 'ts', 'tsx', 'vue'], dts: true, resolvers: [VantResolver()], include: [/\.vue$/, /\.vue\?vue/, /\.md$/, /\.tsx$/, /\.jsx$/], }); };可以得到一个 components.d.ts:
/* eslint-disable */ /* prettier-ignore */ // @ts-nocheck // Generated by unplugin-vue-components // Read more: https://github.com/vuejs/core/pull/3399 export {} declare module 'vue' { export interface GlobalComponents { RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] VanButton: typeof import('vant/es')['Button'] } }然后在 App.tsx 中使用：
export const App = defineComponent(() => { return () => ( <> <VanButton type="primary">myButton</VanButton> <RouterView /> </> ); });会得到 ts 报错：
但事实上组件是可以工作的：
Suggested solution
只需要在 components.d.ts 中添加：
declare global { const RouterLink: typeof import('vue-router')['RouterLink'] const RouterView: typeof import('vue-router')['RouterView'] const VanButton: typeof import('vant/es')['Button'] }就可以消除报错：
所以，可否在生成类型声明时额外添加全局声明以支持 tsx 组件？
虽然 unplugin-auto-import 可以做到这点，但是因为已经有了 xxxResolver 感觉还是更符合知觉一点。
或者如果有现成的解决方案的话请告诉我，谢谢！
Alternative
No response
Additional context
No response
Validations
- Follow our Code of Conduct
- Read the Contributing Guide.
- Check that there isn't already an issue that request the same feature to avoid creating a duplicate.