Nuxt•8mo ago•

6 replies

Components that only use `defineProps`, don't export type information

After upgrading to nuxt

3.17.5

3.17.5

from

3.16.1

3.16.1

, I'm getting type errors from components that use

defineProps

defineProps

, without also using

defineEmits

defineEmits

defineModel

defineModel

.
For example this component:

<script setup lang="ts">
defineProps<{ status: "running" | "paused" }>();
</script>
<template>
  <p>{{ status }}</p>
</template>

<script setup lang="ts">
defineProps<{ status: "running" | "paused" }>();
</script>
<template>
  <p>{{ status }}</p>
</template>

Will give this error:

Object literal may only specify known properties, and 'status' does not exist in type 'Partial<{}> & Omit<{} & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>'.

Object literal may only specify known properties, and 'status' does not exist in type 'Partial<{}> & Omit<{} & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>'.

The error goes away if I update my component like so:

<script setup lang="ts">
defineProps<{ status: "running" | "paused" }>();
defineModel<boolean>() // added this
</script>
<template>
  <p>{{ status }}</p>
</template>

<script setup lang="ts">
defineProps<{ status: "running" | "paused" }>();
defineModel<boolean>() // added this
</script>
<template>
  <p>{{ status }}</p>
</template>

The type of my component is now correctly set as:

{
    readonly status: "running" | "completed" | "draft" | "sending" | "paused";
    readonly modelValue?: boolean | undefined;
    readonly "onUpdate:modelValue"?: ((value: boolean | undefined) => any) | undefined;
} & VNodeProps & AllowedComponentProps & ComponentCustomProps

{
    readonly status: "running" | "completed" | "draft" | "sending" | "paused";
    readonly modelValue?: boolean | undefined;
    readonly "onUpdate:modelValue"?: ((value: boolean | undefined) => any) | undefined;
} & VNodeProps & AllowedComponentProps & ComponentCustomProps

Using

defineEmits

defineEmits

instead of

defineModel

defineModel

also seems to work.
Output of

npx nuxi info

npx nuxi info

- Operating System: `Darwin`
- Node Version:     `v22.10.0`
- Nuxt Version:     `3.17.5`
- CLI Version:      `3.25.1`
- Nitro Version:    `2.11.12`
- Package Manager:  `pnpm@10.12.1`
- Builder:          `-`
- User Config:      `devtools`, `extends`, `devServer`, `css`, `modules`, `ssr`, `vite`, `i18n`, `runtimeConfig`, `compatibilityDate`, `routeRules`, `experimental`, `ignore`, `sentry`, `sourcemap`
- Runtime Modules:  `@nuxtjs/i18n@9.4.0`, `@nuxt/eslint@0.7.6`, `@sentry/nuxt/module@8.43.0`, `motion-v/nuxt@0.10.0`, `@nuxt/test-utils/module@3.19.1`
- Build Modules:    `-`

- Operating System: `Darwin`
- Node Version:     `v22.10.0`
- Nuxt Version:     `3.17.5`
- CLI Version:      `3.25.1`
- Nitro Version:    `2.11.12`
- Package Manager:  `pnpm@10.12.1`
- Builder:          `-`
- User Config:      `devtools`, `extends`, `devServer`, `css`, `modules`, `ssr`, `vite`, `i18n`, `runtimeConfig`, `compatibilityDate`, `routeRules`, `experimental`, `ignore`, `sentry`, `sourcemap`
- Runtime Modules:  `@nuxtjs/i18n@9.4.0`, `@nuxt/eslint@0.7.6`, `@sentry/nuxt/module@8.43.0`, `motion-v/nuxt@0.10.0`, `@nuxt/test-utils/module@3.19.1`
- Build Modules:    `-`

I can't reproduce it in a minimal repo. Has anyone had similar issues and what steps could I take to debug this?

Components that only use `defineProps`, don't export type information

After upgrading to nuxt

3.17.5

3.17.5

from

3.16.1

3.16.1

, I'm getting type errors from components that use

defineProps

defineProps

, without also using

defineEmits

defineEmits

defineModel

defineModel

.
For example this component:

<script setup lang="ts">
defineProps<{ status: "running" | "paused" }>();
</script>
<template>
  <p>{{ status }}</p>
</template>

<script setup lang="ts">
defineProps<{ status: "running" | "paused" }>();
</script>
<template>
  <p>{{ status }}</p>
</template>

Will give this error:

Object literal may only specify known properties, and 'status' does not exist in type 'Partial<{}> & Omit<{} & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>'.

Object literal may only specify known properties, and 'status' does not exist in type 'Partial<{}> & Omit<{} & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>'.

The error goes away if I update my component like so:

<script setup lang="ts">
defineProps<{ status: "running" | "paused" }>();
defineModel<boolean>() // added this
</script>
<template>
  <p>{{ status }}</p>
</template>

<script setup lang="ts">
defineProps<{ status: "running" | "paused" }>();
defineModel<boolean>() // added this
</script>
<template>
  <p>{{ status }}</p>
</template>

The type of my component is now correctly set as:

{
    readonly status: "running" | "completed" | "draft" | "sending" | "paused";
    readonly modelValue?: boolean | undefined;
    readonly "onUpdate:modelValue"?: ((value: boolean | undefined) => any) | undefined;
} & VNodeProps & AllowedComponentProps & ComponentCustomProps

{
    readonly status: "running" | "completed" | "draft" | "sending" | "paused";
    readonly modelValue?: boolean | undefined;
    readonly "onUpdate:modelValue"?: ((value: boolean | undefined) => any) | undefined;
} & VNodeProps & AllowedComponentProps & ComponentCustomProps

Using

defineEmits

defineEmits

instead of

defineModel

defineModel

also seems to work.
Output of

npx nuxi info

npx nuxi info

- Operating System: `Darwin`
- Node Version:     `v22.10.0`
- Nuxt Version:     `3.17.5`
- CLI Version:      `3.25.1`
- Nitro Version:    `2.11.12`
- Package Manager:  `pnpm@10.12.1`
- Builder:          `-`
- User Config:      `devtools`, `extends`, `devServer`, `css`, `modules`, `ssr`, `vite`, `i18n`, `runtimeConfig`, `compatibilityDate`, `routeRules`, `experimental`, `ignore`, `sentry`, `sourcemap`
- Runtime Modules:  `@nuxtjs/i18n@9.4.0`, `@nuxt/eslint@0.7.6`, `@sentry/nuxt/module@8.43.0`, `motion-v/nuxt@0.10.0`, `@nuxt/test-utils/module@3.19.1`
- Build Modules:    `-`

- Operating System: `Darwin`
- Node Version:     `v22.10.0`
- Nuxt Version:     `3.17.5`
- CLI Version:      `3.25.1`
- Nitro Version:    `2.11.12`
- Package Manager:  `pnpm@10.12.1`
- Builder:          `-`
- User Config:      `devtools`, `extends`, `devServer`, `css`, `modules`, `ssr`, `vite`, `i18n`, `runtimeConfig`, `compatibilityDate`, `routeRules`, `experimental`, `ignore`, `sentry`, `sourcemap`
- Runtime Modules:  `@nuxtjs/i18n@9.4.0`, `@nuxt/eslint@0.7.6`, `@sentry/nuxt/module@8.43.0`, `motion-v/nuxt@0.10.0`, `@nuxt/test-utils/module@3.19.1`
- Build Modules:    `-`

I can't reproduce it in a minimal repo. Has anyone had similar issues and what steps could I take to debug this?

Components that only use `defineProps`, don't export type information

Components that only use `defineProps`, don't export type information

Similar Threads

Similar Threads

Similar Threads