vuejs / language-tools

⚡ High-performance Vue language tooling based-on Volar.js
https://marketplace.visualstudio.com/items?itemName=Vue.volar
MIT License
5.87k stars 400 forks source link

Object literal may only specify known properties, and 'modelValue' does not exist in type #4780

Closed amir20 closed 2 months ago

amir20 commented 2 months ago

Vue - Official extension or vue-tsc version

2.1.4

VSCode version

N/a using vue-tsc --noEmit

Vue version

3.4.38

TypeScript version

5.5.4

System Info

System:
    OS: macOS 14.6.1
    CPU: (8) arm64 Apple M3
    Memory: 71.55 MB / 16.00 GB
    Shell: 3.7.1 - /opt/homebrew/bin/fish
  Binaries:
    Node: 22.6.0 - ~/.local/state/fnm_multishells/81365_1725202351998/bin/node
    npm: 10.8.2 - ~/.local/state/fnm_multishells/81365_1725202351998/bin/npm
    pnpm: 9.9.0 - ~/.local/state/fnm_multishells/81365_1725202351998/bin/pnpm
    bun: 1.1.3 - ~/.bun/bin/bun
  Browsers:
    Chrome: 127.0.6533.89
    Safari: 17.6

package.json dependencies

{
"dependencies": {
    "@iconify-json/carbon": "^1.1.37",
    "@iconify-json/cil": "^1.1.10",
    "@iconify-json/ic": "^1.1.18",
    "@iconify-json/material-symbols": "^1.1.89",
    "@iconify-json/mdi": "^1.1.68",
    "@iconify-json/mdi-light": "^1.1.11",
    "@iconify-json/octicon": "^1.1.57",
    "@iconify-json/ph": "^1.1.14",
    "@intlify/unplugin-vue-i18n": "^4.0.0",
    "@tailwindcss/container-queries": "^0.1.1",
    "@tailwindcss/typography": "^0.5.15",
    "@vueuse/components": "^11.0.3",
    "@vueuse/core": "^11.0.3",
    "@vueuse/integrations": "^11.0.3",
    "@vueuse/router": "^11.0.3",
    "ansi-to-html": "^0.7.2",
    "autoprefixer": "^10.4.20",
    "d3-array": "^3.2.4",
    "d3-ease": "^3.0.1",
    "d3-scale": "^4.0.2",
    "d3-selection": "^3.0.0",
    "d3-shape": "^3.2.0",
    "d3-transition": "^3.0.1",
    "daisyui": "^4.12.10",
    "date-fns": "^3.6.0",
    "entities": "^5.0.0",
    "fuse.js": "^7.0.0",
    "lodash.debounce": "^4.0.8",
    "pinia": "^2.2.2",
    "postcss": "^8.4.41",
    "sortablejs": "^1.15.2",
    "splitpanes": "^3.1.5",
    "strip-ansi": "^7.1.0",
    "tailwindcss": "^3.4.10",
    "unplugin-auto-import": "^0.18.2",
    "unplugin-icons": "^0.19.2",
    "unplugin-vue-components": "^0.27.4",
    "unplugin-vue-macros": "^2.11.6",
    "unplugin-vue-router": "^0.10.7",
    "vite": "5.4.2",
    "vite-plugin-compression2": "^1.2.0",
    "vite-plugin-vue-layouts": "^0.11.0",
    "vitepress": "1.3.4",
    "vue": "^3.4.38",
    "vue-i18n": "^9.14.0",
    "vue-router": "^4.4.3"
  },
  "devDependencies": {
    "@pinia/testing": "^0.1.5",
    "@playwright/test": "^1.46.1",
    "@types/d3-array": "^3.2.1",
    "@types/d3-ease": "^3.0.2",
    "@types/d3-scale": "^4.0.8",
    "@types/d3-selection": "^3.0.10",
    "@types/d3-shape": "^3.1.6",
    "@types/d3-transition": "^3.0.8",
    "@types/lodash.debounce": "^4.0.9",
    "@types/node": "^22.5.0",
    "@vitejs/plugin-vue": "5.1.3",
    "@vue/compiler-sfc": "^3.4.38",
    "@vue/test-utils": "^2.4.6",
    "bumpp": "^9.5.2",
    "c8": "^10.1.2",
    "concurrently": "^8.2.2",
    "eventsourcemock": "^2.0.0",
    "jsdom": "^25.0.0",
    "lint-staged": "^15.2.9",
    "prettier": "^3.3.3",
    "prettier-plugin-tailwindcss": "^0.6.6",
    "simple-git-hooks": "^2.11.1",
    "ts-node": "^10.9.2",
    "typescript": "^5.5.4",
    "vitest": "^2.0.5",
    "vue-component-type-helpers": "^2.1.2",
    "vue-tsc": "^2.1.4"
  },
}

Steps to reproduce

Recently, my deps were auto updated and my building starting failing. I narrowed down to vue-tsc from 2.0.29 to 2.1.4.

I have components that use defineModel.

<script lang="ts" setup generic="T">
type DropdownItem = {
  label: string;
  value: T;
};

const { modelValue } = defineModels<{
  modelValue: T;
}>();
</script>

Note that I am using generics.

What is expected?

No typescript errors.

What is actually happening?

Now I see errors:

assets/components/ContainerTable.vue:29:9 - error TS2353: Object literal may only specify known properties, and 'modelValue' does not exist in type '{ options?: DropdownItem[] | undefined; defaultLabel?: string | undefined; } & VNodeProps & AllowedComponentProps & ComponentCustomProps'.

29         v-model="selectedHost"
           ~~~~~~~

Link to minimal reproduction

No response

Any additional comments?

There must be something I am doing wrong. But given that it only shows up with generics, it might be an edge case.

KazariEX commented 2 months ago

/cc @zhiyuanzmj

zhiyuanzmj commented 2 months ago

I know, vue-macros need to support v2.1.4, I will to do it today.

zhiyuanzmj commented 2 months ago

Transfer to vue-macros https://github.com/vue-macros/vue-macros/issues/782