Importing a third party vue component inside an npm package - vuejs2

Question

I am developing an npm package. And I use third party library components inside my package. But I am having trouble importing components inside a package. For example with https://github.com/rlemaigre/Easy-DnD:
My CustomPackageComponent.vue:
<template>
<div>
<drop-list :items="[1, 2]">
<template v-slot:item="{item}">
<drag :key="item">
{{ item }}
</drag>
</template>
</drop-list>
</div>
</template>
<script>
import Vue from "vue";
import {DropList, Drag} from "vue-easy-dnd";
export default {
data() {
return {
someVar: 'foo'
}
},
components: {DropList, Drag}
}
</script>
And next in my index.js file:
import CustomPackageComponent from './components/CustomPackageComponent'
export {
CustomPackageComponent
}
Finally I use in my app. SomeAppComponent.vue:
<template>
<div>
<custom-package-component/>
</div>
</template>
<script>
import {CustomPackageComponent} from '#my-package-scope/some-name'
export default {
components: {CustomPackageComponent},
}
</script>
I have errors:
[Vue warn]: Error in render: "TypeError: Cannot read properties of undefined (reading 'on')"
found in
---> <DropList>
...
TypeError: Cannot read properties of undefined (reading 'on')
at setCurrentInstance (app.js?id=be8d63a4f2dc42c0bbb5:70359:21)
at normalized (app.js?id=be8d63a4f2dc42c0bbb5:72030:9)
at Proxy.renderSlot (app.js?id=be8d63a4f2dc42c0bbb5:71709:13)
at app.js?id=be8d63a4f2dc42c0bbb5:69361:1276
at Proxy.renderList (app.js?id=be8d63a4f2dc42c0bbb5:71658:22)
at Proxy.__vue_render__$4 (app.js?id=be8d63a4f2dc42c0bbb5:69361:1229)
at VueComponent.Vue._render (app.js?id=be8d63a4f2dc42c0bbb5:72308:28)
at VueComponent.updateComponent (app.js?id=be8d63a4f2dc42c0bbb5:72748:27)
at Watcher.get (app.js?id=be8d63a4f2dc42c0bbb5:73932:33)
at new Watcher (app.js?id=be8d63a4f2dc42c0bbb5:73922:51)
[Vue warn]: Error in beforeMount hook: "TypeError: Cannot read properties of undefined (reading 'off')"
found in
---> <BVTransporter>
...
TypeError: Cannot read properties of undefined (reading 'off')
at setCurrentInstance (app.js?id=be8d63a4f2dc42c0bbb5:70357:51)
at VueComponent.Vue._render (app.js?id=be8d63a4f2dc42c0bbb5:72330:13)
at VueComponent.updateComponent (app.js?id=be8d63a4f2dc42c0bbb5:72748:27)
at Watcher.get (app.js?id=be8d63a4f2dc42c0bbb5:73932:33)
at new Watcher (app.js?id=be8d63a4f2dc42c0bbb5:73922:51)
at mountComponent (app.js?id=be8d63a4f2dc42c0bbb5:72765:5)
at VueComponent.Vue.$mount (app.js?id=be8d63a4f2dc42c0bbb5:79061:12)
at VueComponent.Vue.$mount (app.js?id=be8d63a4f2dc42c0bbb5:81625:18)
at init (app.js?id=be8d63a4f2dc42c0bbb5:136420:13)
at createComponent (app.js?id=be8d63a4f2dc42c0bbb5:139300:9)
[Vue warn]: Error in nextTick: "TypeError: Cannot read properties of undefined (reading 'removeAttribute')"
TypeError: Cannot read properties of undefined (reading 'removeAttribute')
at Array.updateAttrs (app.js?id=be8d63a4f2dc42c0bbb5:140051:13)
at patchVnode (app.js?id=be8d63a4f2dc42c0bbb5:139636:62)
at updateChildren (app.js?id=be8d63a4f2dc42c0bbb5:139515:9)
at patchVnode (app.js?id=be8d63a4f2dc42c0bbb5:139641:29)
at VueComponent.patch [as __patch__] (app.js?id=be8d63a4f2dc42c0bbb5:139804:9)
[Vue warn]: Error in nextTick: "TypeError: Cannot read properties of undefined (reading 'on')"
found in
---> <BVTransporter>
...
If I use this code without package everything is ok. I think, that is's something with vue lifecycle, but I don't have any idea how it fix.
Maybe I need to register my package by another way.
I use npm link for local development.
Also I try to import with Vue.Component(...) in CustomPackageComponent.vue:
<template>
<div>
<drop-list :items="[1, 2]">
<template v-slot:item="{item}">
<drag :key="item">
{{ item }}
</drag>
</template>
</drop-list>
</div>
</template>
<script>
import Vue from "vue";
import {DropList, Drag} from "vue-easy-dnd";
Vue.component('drop-list', DropList);
Vue.component('drag', Drag);
export default {
data() {
return {
someVar: 'foo'
}
},
}
</script>
But I have this error:
[Vue warn]: Unknown custom element: <drop-list> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
found in
---> <CustomPackageComponent> at packages/packages/someScope/someName/src/components/CustomPackageComponent.vue
...