Allow generics for Data, Methods, Computed and Props in defineComponent to ease migration from Vue2

[mediafreakch]

What problem does this feature solve?

We have a largish code base in Vue2 and are looking into upgrading it to Vue3. We already use Typescript, but without class components. The way we write components in Vue2 is this:

import Vue from 'vue'

interface Data {
  isActive: boolean
}

interface Methods {
  updateRemote(payload: ApiPayload, options: ApiOptions): void
}

interface Computed {
  selectItems: <string, number>[]
}

interface Props {
  mapType: "osm" | "swiss" | "france"
}

export default Vue.extend<Data, Methods, Computed, Props>({
  name: 'MyComponent',
  props: ["mapType"], // or object
  data() {
     isActive: false
  },
  methods: {
    updateRemote(payload, options) {}
  },
  computed: {
    selectItems() { }
  }
})

This has worked well for us so far. In Vue3, extend has been removed and the way to go is to use defineComponent. However, this function doesn't seem to expose the same generics as Vue.extend did. This makes migration from Vue2 quite costly.

Do you see a way to retrofit defineComponent with an overload that accepts Data, Methods, Computed and Props as Typescript generics?

Partly related to #3102

What does the proposed API look like?

const myComponent = defineComponent<Data, Methods, Computed, Props>({
  ...
})