[Vue warn]: Failed to mount component: template or render function not defined.

[YuriyBakutin]

Version

5.0.0

Reproduction link

https://github.com/YuriyBakutin/vue-select-test

Steps to reproduce

1. Clone repo
2. npm i
3. npm run build
4. Open http://localhost:3001/
5. Open dev tools / console

What is expected?

Select should appear on the page

What is actually happening?

Select does not appear on the page, the console displays an error

---

If you use the following construction:

import vueSelect from 'vue-select/src/components/Select.vue'

no problems occur

---

When using the vue-cli, which is based on webpack, then problems do not arise in any case.

[nathanieltalbot]

Does anyone have a solution to this? I am running into the same thing.

[DonNicoJs]

What is happening is that for some reason the render function get's overridden when rolling up the component(s) I've managed to get it working (at least on the first tests) by returning the render function in the setup call, here is my rolled up component:

var script$2 = {
  name: "LMarker",
  props: props$3,
  setup(props, context) {
    const leafletRef = ref({});
    const ready = ref(false);

    const addLayer = inject("addLayer");

    const latLng = provideLeafletWrapper("latLng");
    provide("canSetParentHtml", () => !!leafletRef.value.getElement());
    provide(
      "setParentHtml",
      (html) => (leafletRef.value.getElement().innerHTML = html)
    );
    provide(
      "setIcon",
      (newIcon) => leafletRef.value.setIcon && leafletRef.value.setIcon(newIcon)
    );
    const { options, methods } = setup$3(props, leafletRef, context);

    onMounted(async () => {
      const {
        marker,
        DomEvent,
        latLng: leafletLatLng,
        setOptions,
      } = await import('leaflet/dist/leaflet-src.esm');
      updateLeafletWrapper(latLng, leafletLatLng);

      leafletRef.value = marker(props.latLng, options);

      const listeners = remapEvents(context.attrs);
      DomEvent.on(leafletRef.value, listeners);

      leafletRef.value.on("move", debounce(methods.latLngSync, 100));
      propsBinder(methods, leafletRef.value, props, setOptions);
      addLayer({
        ...props,
        ...methods,
        leafletObject: leafletRef.value,
      });
      ready.value = true;
    });

    return () => {
      if (ready.value && context.slots.default) {
        return h(
          "div",
          { style: { display: "none" } },
          context.slots.default()
        );
      }
      return null;
    };
  },
};

const render$2 = () => {};

script$2.render = render$2;
script$2.__file = "src/components/LMarker.vue";