How can I build a vue library as umd module that depends on other components?

Viewed 467

I am trying to build a vue library which should be bundled as a umd module so that it can be used via script tag in the browser. The library itself publishes a vue component and is using vuetify but does not ship with vuetify because the consumer bundles should contain it. I am using the webpack configuration externals to prevent that vuetify is part of the final bundle. I have also added vue and other dependencies there. The index.js of my library just looks like this:

import MyComponent from './MyComponent'

export default MyComponent
export {
  MyComponent
}

Now I created a vue application where the library itself is loaded by a script tag in the index.html. I registered all vuetify components with Vue.component(name, component) and used Vue.component('MyComponent', MyLibrary.MyComponent) to register my custom component. Unfortunately I am getting lots of errors like Unknown custom element: <VuetifyComponent>. So the problem seems to be that the library looks for vuetify components that exist in the window scope instead of taking those components from my vue application. Is there any way to convince a umd library to take dependencies from the consuming bundle?

0 Answers
Related