nuxt / module-builder

Complete solution to build and ship Nuxt modules.
MIT License
211 stars 22 forks source link

Incorrect transform of Vue components written in `TSX` #293

Open alSergey opened 1 week ago

alSergey commented 1 week ago

Describe the bug

When transform tsx components, they are converted to js files using the jsx function from vue/jsx-runtime. This results in warnings from Vue, as shown in the screenshot below. Code is how it looks in the browser.

export default defineComponent({
  setup(_, { slots }) {
    return () => /* @__PURE__ */ jsx(
      "div",
      {
        children: slots.default?.()
      }
    );
  }
});

image

However, if the tsx components are left as is, they are converted to js files using the createVNode function from vue. In this case, no errors occur. Code is how it looks in the browser.

const __default__ = defineComponent({
  setup(_, {
    slots
  }) {
    return () => _createVNode("div", {
      "data-v-inspector": ".nuxt/layouts.wms-auth.300d01f6.tsx:6:3"
    }, [slots.default?.()]);
  }
});
export default __default__

Reproduction

I can't provide reproduction because I'm using an internal UI Kit