NuxtN
Nuxt15mo ago
5 replies
blustin_blieber

What types to use for Typed-Pages and NuxtLink in defineProps

Hi. I have enabled experimental typed-pages and would like to define a component with props that can be passed to <NuxtLink> safely and enforce typed routes.

I define these types:
export type NavigateTo = NuxtLinkProps['to'];
export type RouteName = keyof RouteMap;


In my components:

<script setup lang="ts">
// THIS throw vue-tsc error Vue: Expression produces a union type that is too complex to represent.
withDefaults(defineProps<{
  to: NavigateTo,
  routeName: RouteName
}>(), {
  to: undefined,
  routeName: undefined
})
</script>


The types autocomplete properly but the app throws errors in vue-tsc with the withDefaults
Vue: Expression produces a union type that is too complex to represent.


So my question is, how does one safely use typed routes in components as typescript typings? thank you
Was this page helpful?