defineProps fails with import/export * as Types

[unshame]

Vue version

3.3.4

Link to minimal reproduction

https://play.vuejs.org/#eNqNU01v00AQ/SuLLymo9gqVU+RGBVQJOEAFlbj4YuyJs8X7oZlxGmT5vzO7DsGED3HzvPl67816zF6GUOwHyNZZSQ2awIqAh6D62nXXVcZUZZvKGRs8shoVwlZNaoveqpW0rU6pZ6omdf8tAB2zheYYSUXlWtgaB3foA5Wppkjfm4unMdt4R6wsdeo6zr9YvYG+9+qzx759spKSUs/UhIgEDDb0NYNESpW755txTM3TVGqJEmpcGFjtc+tb6EWG5JOOUp+6s8tspp7bOhQP5J14MMbu6pgQ6WuVkIiJ2hhX2Y450FrrpnXSJvPNHgsHrF2w+kbKNA6OjYW89fbmqrgqXujWEC/hAsjmX9A/EqAMqbLLxRot4B4wRxDjEPB/1561LVefpX5bH7dPlZvEFCa5x9Z0Z5Y03gbTA34IbORev1hTy7ke3yWMcYCTlmYHzdc/4A90mDXdISRmC/1cYwc8p28/vYeDfJ+Scs6hP57hL8mPQL4fIse57NXgWqG9qEts36YLG9fd0+2BwdEPUZFociPVp3u8/of0n3TF7aWL6ZUziYFwSD9IRFR69vLMxwrnCUGAtSJGoRKxKZu+A1hFNfI=

Steps to reproduce

1. Define some types in a file

types.ts

export type Props = {
    prop: string
}

2a. Import those types with * as Types notation and use them in defineProps App.vue

import * as Types from './types'

defineProps<Types.Props>()

2b. Re-export them with * as Types, import them normally and use them in defineProps

index.ts

export * as Types from './types'

App.vue

import { Types } from './index'

defineProps<Types.Props>()

What is expected?

The component would compile normally.

What is actually happening?

Compilation fails with

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

src/App.vue
3  |  import * as Types from './types'
4  |  
5  |  defineProps<Types.Props>()
   |              ^^^^^^^^^^^
6  |  
7  |  const msg = ref('Hello World!')
    at ScriptCompileContext.error (https://cdn.jsdelivr.net/npm/@vue/compiler-sfc@3.3.4/dist/compiler-sfc.esm-browser.js:47587:11)
    at innerResolveTypeElements (https://cdn.jsdelivr.net/npm/@vue/compiler-sfc@3.3.4/dist/compiler-sfc.esm-browser.js:47718:20)
    at resolveTypeElements (https://cdn.jsdelivr.net/npm/@vue/compiler-sfc@3.3.4/dist/compiler-sfc.esm-browser.js:47654:35)

System Info

-

Any additional comments?

import * as Types from './types'

export { Types }

doesn't work either.

The use-case is to export the types of components in a library as a single "namespace" (I couldn't find what the actual thing you get from doing import/export * as Types is called in typescript), so you would be able to do import { MyComponent, MyComponentTypes } from 'my-components'.

[KieranNexusPoint]

Just discovered this myself for defineEmits. Works fine when not using wildcard import:

// broken
import * as Consts from './consts';

const emit = defineEmits<Consts.Emits>();

// works
import { Emits } from './consts';

const emit = defineEmits<Emits>();

// also works
import { Emits as RenamedEmits } from './consts';

const emit = defineEmits<RenamedEmits>();