Subscribe on changes!

SFC `setup` script does not make imported components available to template with TypeScript + Pug

avatar
Aug 11th 2021

Version

3.2.2

Reproduction link

https://github.com/spenserblack/setup-script-typescript-and-pug-issue

Steps to reproduce

  1. Create an SFC with <template lang="pug"> and <script setup lang="ts">
  2. Import a component
  3. Use component in template

What is expected?

Imported component is rendered.

What is actually happening?

Imported component is not rendered, receive warning

[Vue warn]: Invalid vnode type when creating vnode: undefined

This seems to happen specifically when TypeScript and Pug are used together. As you can see in the reproduction, when <template> <script setup lang="ts">, component renders, and when <template lang="pug"> <script setup>, component renders. Only <template lang="pug"> <script setup lang="ts"> seems to cause the issue.

avatar
Aug 12th 2021

I have facing a similar issue with vuedraggable ^4.0.3

image

image

image

Regardless this little problem, it is still one of the best feature Vue provides, would be even better if we could have a global defineEmits/defineProps etc. without needing import every single time. 😀

avatar
Aug 12th 2021

would be even better if we could have a global defineEmits/defineProps etc. without needing import every single time.

The implementation in 3.2 is providing exactly that. Are you already on 3.2.1 ?

avatar
Aug 12th 2021

would be even better if we could have a global defineEmits/defineProps etc. without needing import every single time.

The implementation in 3.2 is providing exactly that. Are you already on 3.2.1 ?

I am using Vue 3.2.2 and Vue cli 4.5.13, just tried to do it without defineEmits, however it shows an error image

Last night I just keep converting all files to