Implicit component names from vue libraries

// in main.js in a vue app
import VueCarousel from 'vue-carousel'
Vue.use(VueCarousel)
// seems to export a component called Carousel

// in your Carousel component that calls the Carousel library
export default {
  name: 'Carousel', // this will cause a circular reference because VueCarousel exported their carousel component as "Carousel"
  data() {
    return {
      images: getImgs(),
    }
  },
}

// in your Carousel component that calls the Carousel library
export default {
  name: 'CarouselComponent', // fixed.
  data() {
    return {
      images: getImgs(),
    }
  },
}

this means for every library, you have to keep track of their names / name your components my-component or something to avoid name clashes

ref

and other stuff: https://itnext.io/how-not-to-vue-18f16fe620b5