vue 2.7: TS7056 Triggered when ref type argument has a vue component as an option and an initial ref value is passed

2.7: TS7056 Triggered when ref type argument has a vue component as an option and an initial ref value is passed

Open nermolov opened this issue 2 years ago • 2 comments

Version

2.7.14

Reproduction link

github.com

Steps to reproduce

Create a new Vue 2 + Typescript project with npx vue create
Upgrade project to Vue 2.7 with npm install [email protected]
Set "declaration": true in tsconfig.json
Declare a ref in your component setup whose type argument is a union of a different vue component or null, and set its initial value to null: const helloWorld = ref<InstanceType<typeof HelloWorld> | null>(null);
Return the ref from setup

What is expected?

No error

What is actually happening?

npx vue-tsc --emitDeclarationOnly
src/App.vue:12:1 - error TS7056: The inferred type of this node exceeds the maximum length the compiler will serialize. An explicit type annotation is needed.

 12 export default defineComponent({
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 13   name: 'App',
    ~~~~~~~~~~~~~~
... 
 23   }
    ~~~
 24 });
    ~~~

Not passing an initial value, e.g.

const helloWorld = ref<InstanceType<typeof HelloWorld> | null>();

does not trigger the error, nor does passing an initial value when the type argument does not include another Vue component, e.g.

const xyz = ref<string | undefined>(undefined);

"declaration": true is needed because the repo this issue was discovered in is a shared package that is imported by other Vue applications, and type declarations are required.

This issue does not happen with Vue 2.6 with @vue/composition-api, only 2.7