Vue 3 (+ Vue CLI 5): component not rendered in production

Question

Main question:

Why could a component not be rendered in production but appear as an element in the HTML-body, while in development everything seems to work just fine?

Graphical example:

Inspecting the elements with chrome's developer tools:

• In development, it is as expected:

• In production, I see an element with the component name but that component is not rendered:

Context:

I have a large Vue 3 application that calls an external component:

<template>
  <div>
    <wkpComponent
    />
  </div>
</template>

<script>
  import { defineAsyncComponent } from 'vue';
  import externalComponent from '@/util/external-component';
  import * as Vue from 'vue/dist/vue.esm-bundler';
  window.Vue = Vue;

  var host = window.location.protocol + "//" + window.location.host.split(':')[0];
  const wkpComponent = defineAsyncComponent(
    () => externalComponent(host + `:8087/wkpApp.umd.min.js`)
  );

  export default {
    name: "WkpView",
    components: {
      wkpComponent,
    },
    data() {
      return {
      }
    },        
  };
</script>

The external application is based on a "minified" build that results from the command (I suspect that that could be the issue):

npx vue-cli-service build --target lib --formats umd-min --no-clean --dest dist --name "wkpApp" --inline-vue

The App.vue of that project looks like:

<template>
  <div id="app">
    <wkp-view id="test1" :WKPsettings="WKPsettings" />
  </div>
</template>

<script>
import WkpView from '@/components/WKP/wkp-view.vue'

export default {
  components: {
    WkpView,
  },
}
</script>

In turn, the wkp-view.vue component that is imported is something like:

<template>
    <div id="base-bg">
        <h1> Yoo </h1>
    </div>
</template>

<script>

export default {
    data() {
        return {
        }
    },
}
</script>