Subscribe on changes!

Different slot content in prod and dev mode

avatar
Dec 23rd 2021

Version

3.2.26

Reproduction link

github.com

Steps to reproduce

  1. Clone repo
  2. run 'npm i'
  3. run 'npm run serve' --- you will see v-if in the console
  4. then run 'npm run serve:prod' -- you will see undefined in the console

What is expected?

I expect in prod mode the same result as dev mode

What is actually happening?

I get different values of children. I need the same result because I try to analyze all slots in my components

avatar
Dec 24th 2021

This is because the program is optimized in prod modeļ¼Œthe HelloWorld component is compiled into:

const _sfc_main$1 = {
  setup(__props) {
    return (_ctx, _cache) => {
      return openBlock(), createBlock(_sfc_main$2, { opt2: "4321" }, {
        default: withCtx(() => [
          createCommentVNode("", true)
        ]),
        _: 1
      });
    };
  }
}

So,this.$slots.default()[0].children is undefined

avatar
Dec 24th 2021

In dev mode, the HelloWorld component is compiled into:

function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  return (_openBlock(), _createBlock($setup["Comp1"], { opt2: "4321" }, {
    default: _withCtx(() => [
      false
        ? (_openBlock(), _createBlock($setup["Comp2"], { key: 0 }))
        : _createCommentVNode("v-if", true)
    ]),
    _: 1 /* STABLE */
  }))
}