How to fix the error "Unknown custom element: <bot-ui>"?

Question

I'm trying to create a chatbot screen using "botui" and "vue-cli".
However, I get an "Unknown custom element: " error and cannot display the screen.
The code is as follows.
Can you tell me if I am doing something wrong or if there is a solution?

<template>
  <div>
    <div id="botui">
      <bot-ui></bot-ui>
    </div>
  </div>
</template>

<script>
import vue from 'vue'
import Botui from 'botui'

export default {
  data() {
    return {
      botui: ''
    }
  },
  mounted() {
    this.startBot
  },
  methods: {
    startBot() {
      this.botui = new Botui('botui', { vue })
      this.botui.message.add({
        content: {
          text: 'Hello'
        }
      })
    }
  }
}
</script>

Answer 1

please can you try calling botui in the components?

  data() {
    return {
      botui: ''
    }
 
  components:{
       Botui 
      },
  }