I'm using vue-cli for build my lib with this mand:

"build": "vue-cli-service build --target lib --name myLib ./src/ponent.vue"

How can I import my ponent from the dist folder after the build?

If I import from path-to-myLib/src/ponent.vue, everything is fine! But the code below does not work:

// undefined
import { ponent } from 'path-to-myLib/dist/myLib.umd.js' 
// undefined
import myComponent'path-to-myLib/dist/myLib.umd.js' 
// result: .png
import * as myComponent'path-to-myLib/dist/myLib.umd.js'

I cannot understand what the problem is.

I'm using vue-cli for build my lib with this mand:

"build": "vue-cli-service build --target lib --name myLib ./src/ponent.vue"

How can I import my ponent from the dist folder after the build?

If I import from path-to-myLib/src/ponent.vue, everything is fine! But the code below does not work:

// undefined
import { ponent } from 'path-to-myLib/dist/myLib.umd.js' 
// undefined
import myComponent'path-to-myLib/dist/myLib.umd.js' 
// result: https://i.sstatic/xHSzL.png
import * as myComponent'path-to-myLib/dist/myLib.umd.js'

I cannot understand what the problem is.

• javascript
• vue.js
• vuejs2
• vue-ponent
• vue-cli

• 1 In order to import a library it has to be exported from your main.js or the mylib.umd.js first. You should include (import) the .vue ponent inside that file and then export it from there. Check my answer one how to import vue ponents here: stackoverflow./questions/47754244/… – samayo Commented Aug 9, 2018 at 17:35
• 1 Try export { foobar } – samayo Commented Aug 9, 2018 at 17:50
• 1 Did u give your ponents a name? It is required. Component.vue should have name attribute with value of the ponent you are trying to import – samayo Commented Aug 9, 2018 at 17:55
• 1 I meant inside your ponent.vue like in this example github./samayo/vuejs-hello-app/blob/master/src/ponents/…. If not check my previous link or the github code, the SO link shows step-by-step process on how to make the lib and the github code shows the finished product. You can mirror-check your code to see what is missing – samayo Commented Aug 9, 2018 at 18:04
• 1 Ah, sorry for that. Wish I could help but I had the same issue when building the library so your problem is not that far apart – samayo Commented Aug 9, 2018 at 18:07

2 Answers 2

you must add main to your package.json like this "main":"path-to-myLib/dist/myLib.umd.js", pointing to the generated umd file and then use import {ponent} from 'library' and use in library library name

Wherever you'd like to use your built ponent, just import it like this:

import MyComponent from 'path/to/MyComponent.umd.js'

This syntax was not mentioned in your attempts, so I guess it is just an import statement typo.