Vue version

3.3.4

Link to minimal reproduction

https://github.com/tragid/vue-default-export-error

Steps to reproduce

I'm trying to build a Button component using Typescript and utilizing types of HTML element imported from Vue package. Here is the code:

import type { ButtonHTMLAttributes, LinkHTMLAttributes } from 'vue'
import type { RouterLinkProps } from 'vue-router'

type ButtonOrAnchorProps = BaseProps & ButtonHTMLAttributes & LinkHTMLAttributes
type ButtonAsRouterLink = BaseProps & RouterLinkProps & LinkHTMLAttributes
type ButtonProps = ButtonAsRouterLink | ButtonOrAnchorProps

const props = defineProps<ButtonProps>()

What is expected?

The type should be imported normally without any error.

What is actually happening?

Vue throws error:

[@vue/compiler-sfc] Unresolvable type reference or unsupported built-in utility type

It's kind of strange because I can still access the attributes from props variable like props.href but the app is not running.

What I tried is to create alternative types that extend ButtonHTMLAttributes and LinkHTMLAttributes, it's like:

import { type ButtonHTMLAttributes, type LinkHTMLAttributes } from 'vue'

export interface BtnHTMLAttr extends /* @vue-ignore */ ButtonHTMLAttributes {}

export interface LinkHTMLAttr extends /* @vue-ignore */ LinkHTMLAttributes {}

The import error is gone but the app is still not functioning properly. When I add a href prop to the component, seems like the component doesn't recognize href prop

System Info

No response

Any additional comments?

No response