【compiler-core】为什么插槽混用会导致作用域不明确的问题？会导致编译阶段报错，且报错内容难以定位是插槽混用导致的

[Edge00]

Version

3.2.33

Reproduction link

Vue SFC Playground

Steps to reproduce

1. 打开复现链接
2. 去掉 src/App.vue 中的注释内容

What is expected?

希望页面能够正常渲染，因为从代码内容来看，作用域是明确的

What is actually happening?

编译阶段报错：

Codegen node is missing for element/if/for node. Apply appropriate transforms first.

不太理解文档中的「导致作用域不明确」具体是什么问题

[coder-hxl]

这种用法是错误的，当你使用default插槽时，会把default插槽原先的内容替换掉。header插槽和footer插槽不存在于default里面，Vue也就无法找到这两个插槽

[liulinboyi]

插槽里面用插槽确实会报错

<template>
  <Child v-slot="slotPropsDefault">
      <h2>default {{ slotPropsDefault.task }}</h2>

    <template v-slot:header="slotPropsHeader">
        <h2>header, {{slotPropsHeader.task}}</h2>
    </template>

    <template v-slot:footer="slotPropsFooter">
        <h2>footer, {{slotPropsFooter.task}}</h2>
    </template>
  </Child>
</template>

<script>
import Child from './Child.vue'
export default {
  name: "App",
  components: {
    Child,
  },
};
</script>

报错示例

[Edge00]

这种用法是错误的，当你使用default插槽时，会把default插槽原先的内容替换掉。header插槽和footer插槽不存在于default里面，Vue也就无法找到这两个插槽

@coder-hxl 确实是这样，谢谢！