Subscribe on changes!

defineProps<T> partial object type inferred as 'unknown'

avatar
Sep 8th 2023

Vue version

latest 3.3.4 / 2.7.14

Link to minimal reproduction

https://play.vuejs.org/#eNqtU01zmzAQ/StbLk5mAkzBl1Lqpu3k0B5aT9ojFwprRwmsVGmxnfHw3yuE7aikyeSQG3pvP96+XfbBJ6WiTYdBFuSm0kIxNCWtPxQBmyIAg9ypRUGCGPWqrBB+KBaS3sK+IAAW3ODHDAxrQesBqXGsYmM8vH9cIfEqvKhAQTWuBOFSS2VylyxHLdlR1PsHMDmCiQemGVzjn05orPNDysKj5xksS82ibA5sMrD94uy8oDweZVkv7IOxVU3JaF8AeS027gNgvz9qitxg0PeQvwlDGESj5nuYOXwGtUQDJBlwJwyDJOB7hTDr6I7klmYRm7MkTd+dQxhOiyen4hMifYqYv7qcPB6nzmPPi+AiEK2SmsO2VNGtkWTPym2qOBD2prJx8QNm7254F8ENszJZHFc12bQaG7HRESHHpNr40obFuiMWLYa1bC/TKI3mtr9hH47QtOFvLbcGtS1SBBdem9iCG9ShRntFGvVL207S/NYT6lH7obvdQ29NYVNJWon1xJJKtko0qMdj+9easmnk9pvDWHd4mqW6weruP/it2Y0zLTU6Zd78XOo18khf/fyOO/t9IltZd81hDU+Q12hk0w0ax7DPHdVWthfn1H51G7a/6y9ztWMkcxxqEOrccPFuH1+eGf1BrnX75GL/F7YLlgE=

Steps to reproduce

<script lang="ts" setup>
interface Option1 {
  title?: string
  description?: string
}
interface Option2 {
  title: string
  description?: string
}

defineProps<{
  option1: Option1;
  option2: Option2;
  option3: Required<Option1>;
  option4: Partial<Option2>;
}>()
</script>

<template>
  <div>
    {{ option1.title }} <!-- Property 'title' does not exist on type 'unknown'.ts(2339) -->
    {{ option2.title }}
    {{ option3.title }}
    {{ option4.title }} <!-- Property 'title' does not exist on type 'unknown'.ts(2339) -->
  </div>
</template>

What is expected?

Prop option1 inferred as object and property 'title' inferred as string | undefined.

What is actually happening?

Prop option inferred as 'unknown', Property 'title' does not exist on type 'unknown'

System Info

System:
    OS: macOS 13.4.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 240.05 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 16.20.0 - ~/.nvm/versions/node/v16.20.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v16.20.0/bin/yarn
    npm: 8.19.4 - ~/.nvm/versions/node/v16.20.0/bin/npm
    pnpm: 7.13.4 - ~/.nvm/versions/node/v16.20.0/bin/pnpm
  Browsers:
    Edge: 116.0.1938.76
    Safari: 16.5.2
    Safari Technology Preview: 17.0

Any additional comments?

https://discord.com/channels/325477692906536972/331999220125138944/1148868108719767573

avatar
Sep 8th 2023

/cc @so1ve

avatar
Sep 8th 2023

image

Works on my machine :)

avatar
Sep 8th 2023

Any idea why vue playground fails?

avatar
Sep 9th 2023

@Disservin I think vue playground needs to update volar

avatar
Sep 15th 2023

I am using nuxt 2.17.1 based on vue 2.7, using latest volar extentions. Is there a solution?

avatar
Sep 15th 2023

@serialine Do you mean you are experiencing this issue on your machine? Could you please provide a reproduction repository?

avatar
Sep 15th 2023

I am using nuxt 2.17.1 based on vue 2.7, using latest volar extentions.

vue 2.7?

avatar
Sep 15th 2023

@so1ve Yes on my machine. I created a reproduction and found the cause of the problem. it happens when "strict": false in the tsconfig.json. but the minimal requirements condition "noImplicitThis": true is configured.

https://github.com/serialine/nuxt-2.17.1-ts

avatar
Sep 15th 2023

@serialine Thanks for your reproduction. It would be great if you report this issue to https://github.com/vuejs/language-tools instead of this repo so we can track there.