Subscribe on changes!

Type misdeclaration when using <script setup>

avatar
Aug 19th 2021

Version

3.2.4

Reproduction link

https://github.com/SebastianSpeitel/vue-bug

Steps to reproduce

npm i
npm run build

What is expected?

Template compiles without errors

What is actually happening?

Build fails with:

semantic error TS2345: Argument of type '{ new (): { $props: VNodeProps; }; __isFragment: true; }' is not assignable to parameter of type 'string'

But ignoring the type-error, the JS output still works.

That's the template:

<template>
  <div>
    <span v-for="s in ['a', 'b']" v-text="s"></span>
  </div>
</template>

<script setup lang="ts">
const message = "Hello Vue!";
</script>

<!-- Works with:   
<script lang="ts">
export default {
  setup() {
    return {};
  }
};
</script>
-->

The diff of the non-setup version and the setup version:

11318,11323d11317
< var script = {
<     setup() {
<         return {};
<     }
< };
< 
11324a11319,11332
> var script = defineComponent({
>     setup(__props) {
>         const message = "Hello Vue!";
>         return (_ctx, _cache) => {
>             return (openBlock(), createElementBlock("div", null, [
>                 (openBlock(), createElementBlock(Fragment, null, renderList(['a', 'b'], (s) => {
>                     return createBaseVNode("span", {
>                         textContent: toDisplayString(s)
>                     }, null, 8 /* PROPS */, _hoisted_1);
>                 }), 64 /* STABLE_FRAGMENT */))
>             ]));
>         };
>     }
> });
11326,11336d11333
< function render(_ctx, _cache, $props, $setup, $data, $options) {
<   return (openBlock(), createElementBlock("div", null, [
<     (openBlock(), createElementBlock(Fragment, null, renderList(['a', 'b'], (s) => {
<       return createBaseVNode("span", {
<         textContent: toDisplayString(s)
<       }, null, 8 /* PROPS */, _hoisted_1)
<     }), 64 /* STABLE_FRAGMENT */))
<   ]))
< }
< 
< script.render = render;

Probably duplicate of https://github.com/vuejs/vue-next/issues/4390