Vue version

3.3.4

Link to minimal reproduction

https://play.vuejs.org/#eNqFUbFOwzAQ/ZWTBwJSaRamNI3EgsSGRMXkJW6urYXjs2ynVRTl3zmHQCMGOtnne/feu+dBPDu3PncoClGGvdcuQsDYOTC1PW6liEGKSloA3TryEV6IXiO2cPDUQrbO5zpRZAm2JxsiHIhgC0M6C3hagap9AdkJjaFsBTp86KCVwQKi7xDGjbTSlvm3PqtxwZzO1BEn7fJH9fyotG3YFhNLATl3y3wB5TLE3qSroqaHIU2rev959NTZpgBluGC5ZNQQm7qcdMTpYZwszNNiJRab3Qgn9g5TMNeVbdcq9JvEOTXfqcU3Ty6Uu4pRO7hj5CIGRWSwtgkvbYMHbWf4dZD5q+r+4f+cGn3mjMKJLuzul59Nzh8y2YNxLHNG/g1PjF+nxbYT

Steps to reproduce

type Foo = { foo: number; }
type SomeProps<T> = T & { isVisible: boolean }

What is expected?

this should be valid typescript:

https://www.typescriptlang.org/play?#code/C4TwDgpgBAYg9nKBeKBvKAzBAuKA7AVwFsAjCAJygF8AoUSKAZTiIgAVy4wBnAHgBUAfMij8oAMjRQAltwBqs6SQA2EXCQSqAhnmo0AxnDzdgmHExbtOPXvDjCU6LHFwBmADQz5ilWqjByAmgqAG4aaQwoAApnADpZBW4lVQBKKENjOFVY5TgAcxiEFJCgA

What is actually happening?

compile error:

1:55:02 AM [vite] Internal server error: [@vue/compiler-sfc] Unresolvable type reference or unsupported built-in utility type

/testdir/src/FooItem.vue
1  |  <script setup lang="ts">
2  |  type Foo = { foo: number }
3  |  type SomeProps<T> = T & { isVisible: boolean }
   |                      ^
4  |
5  |  defineProps<SomeProps<Foo>>()
  Plugin: vite:vue
  File: /testdir/src/FooItem.vue
      at ScriptCompileContext.error (/testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:15841:11)
      at innerResolveTypeElements (/testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:17966:20)
      at resolveTypeElements (/testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:17902:35)
      at /testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:17924:31
      at Array.map (<anonymous>)
      at innerResolveTypeElements (/testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:17924:20)
      at resolveTypeElements (/testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:17902:35)
      at innerResolveTypeElements (/testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:17947:16)
      at resolveTypeElements (/testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:17902:35)
      at resolveRuntimePropsFromType (/testdir/node_modules/.pnpm/@vue+compiler-sfc@3.3.4/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:19312:20)

System Info

  System:
    OS: macOS 12.0.1
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 44.49 GB / 64.00 GB
    Shell: 5.1.4 - /usr/local/bin/bash
  Binaries:
    Node: 16.20.0 - ~/.nvm/versions/node/v16.20.0/bin/node
    npm: 8.19.4 - ~/.nvm/versions/node/v16.20.0/bin/npm
  Browsers:
    Chrome: 113.0.5672.126
    Chrome Canary: 116.0.5806.0
    Firefox: 111.0
    Safari: 15.1
    Safari Technology Preview: 15.4
  npmPackages:
    vue: ^3.3.2 => 3.3.4

Any additional comments?

I'm not actually sure if I'm characterizing this correctly, but it seems like the sfc compiler cannot handle props whose type intersects one of its own generic parameters.

full pnpm lockfile if that's useful: https://gist.github.com/superfreddialpad/248efe40250d772938f31a2440e54e35

Pretty sure this is a duplicate of #8468

@justin-schroeder They're not exactly the same.

I get the same error when I use an imported type as an alias. I'm not 100% sure if these errors are related.

<script setup lang="ts">
import type * as T from './Foo.types'
defineProps<T.Props>()
</script>

Here is the link for reproduction: https://play.vuejs.org/#eNqFU8lu2zAQ/ZUBL24LVz6kJ0UJ0BYpkB7aoDV64kXLWGZCkQSH8gJD/94hJTtCUTgncRZy3jI6ic/OZbseRS4Kqr1yAQhD70CXpr2TIpAU99IAqM5ZH+CbtY8BO9h428EiW01xfGIR22prKMDGWriDU/zm8GkJVelzWGxRa7tYgqI/ilSlMYfge4ThVhppitU4n6dxwG86XQZMs4vz1N3HSpmGYfHDUsCKq8Vq1sohhaOOx8o2RzjF21VZv7Te9qbJodIc8LgIVFsGtd+qgCkxJAjTbbEUM2ZviDNJE44O4QOUBOu5PFnME4sjTYMbZfDJW0fFOkvf+3fvr1Nv1I5p09bueeBFOZ47aZxEhmEoVtz5rx5MIxBbslFt9kzWMJEkiRS17ZzS6H+6oNgyKfJRrFgr2ab995SL/izP+XqL9ct/8s90iDkpnjwS+h2ju9RC6VsMY/nh9w888PlS7GzTRy5Xir+QrO4jxrHtC9vIsGd9Ce1jskCZdk0Ph4CGzqQi0ORu6peC3fx6hfor3JvsZtqKYVyG0ccsEIuIh1fHk41p22d7XVmrsTS34x9AwTM03nMx/AVHMyjZ

Hello !! I have done pnpm update after your update but, i always have the same error.

this is my code

`export default interface IDynamicSelectInput<E, K, L>{

//props: PropsType & L; props: PropsType & L emits: EmitsType; }`

this is error

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

/home/trandx/dev/Nucle-x/sso/_mono/packages/ui/src/components/atoms/list/index.ts 11 | //(event: "change", elt: OptionsType | OptionsType[] ): void; 12 | //(event: 'remove'): void 13 | } & T; | ^ 14 |
15 | type optionFormatType = { name: string; value: valType };`

Yep I also tested the latest version (3.3.10) and still have the same issue.

@Trandx your code doesn't show how the interface is used in the component.

@amritk If you are still having the same error, make sure to provide the exact and complete code that is causing the error because there can be many different ways of using generics.

I am not sure if it is connected, but I have simillar problem even after updating from 3.3.4 to 3.3.13

// Those types are in a separate file and are imported into the component

export type ExtractExtraApiGetRequestParams<T extends ApiGetRequestParams> = Subtract<
  T,
  ApiGetRequestParams
>;

export type Subtract<T extends U, U> = Pick<T, Exclude<keyof T, keyof U>>;

const props = defineProps<ExtractExtraApiGetRequestParams<ApiAuditGetRequest>>();

ApiAuditGetRequest extends ApiGetRequestParams.

And I am getting: [plugin:vite:vue] [@vue/compiler-sfc] Unresolvable type reference or unsupported built-in utility type