Dist version seems different?

[redxtech]

Dist version seems different?

[iCrawl]

I didn't encounter that issue, but there seems generally either be a wrong version used.
The package.json says v5 but either the readme is wrong or the dist/ is wrong since in v4 it was stated that:

• Renamed main component from <plyr> to <vue-plyr>.

But doing <vue-plyr> just results in Vue telling me that vue-plyr is indeed not a thing. Changing it to <plyr> works indeed.

[redxtech]

I'll take a look as soon as I get home.

[qarthandgi]

Been gettin Unknown custom element errors in Vue.
I renamed <vue-plyr> to <plyr> and the error suddenly went away.

[irazasyed]

@redxtech Any updates?

[irazasyed]

@iCrawl @qarthandgi Apparently it's compiling old version which is why we don't see vue-plyr and instead plyr which is only present in previous versions of the project.

[redxtech]

Hey sorry guys I'll take a look at this later today. I've had some personal stuff going on the past week or so and haven't been able to spend any time on this component.

[redxtech]

Ok I checked it out and published a new version (5.0.2) which should fix this error. Let me know if it doesn't work for you.

@irazasyed @iCrawl @qarthandgi

[akarelas]

@redxtech I can't make it work. You can check out my absolutely minimal nuxt project (which I published for you) here: https://github.com/akarelas/test-vue-plyr

Has just two commits - first is how next scaffolded it, and the second is how I modified it for vue-plyr.

Installation and running instructions are on the project repo's homepage.

You can test it if you like.

[irazasyed]

@redxtech Thanks for looking into this issue. The new patch has everything except the export of VuePlyr and it still is missing when I try to import it.

Ex:

import { VuePlyr } from 'vue-plyr'

I want to add this as a component inside a component. While the source file does export VuePlyr, for some reason it's missing in the compiled version.

[redxtech]

Does the source file export it? I thought I removed that to bypass the named exports thing where the default export needed to be VuePlyr['default']. Now you can just import VuePlyr from 'vue-plyr' and then Vue.use(VuePlyr)

[irazasyed]

@redxtech It was exporting earlier and I downloaded this repo and manually importing the index file into my project and it works good (With that export we had earlier).

I don't want to include it as a global component which is why I'm importing into just one component I have in my project as its usage is limited to one section of the project. Please consider adding it back.

[redxtech]

@akarelas that is an entirely different error altogether. That is currently open at #32 & sampotts/plyr#1220. Needs to be fixed upstream.

[redxtech]

@irazasyed I'll look into a nice way to have both default and named exports. Just a question though, is there any performance improvement to having the component installed locally or is is just preference to not globally install it? Also the reason that cloning the repo was probably because you were using the master branch which I hadn't merged the patch into yet.

[redxtech]

@irazasyed I added the named imports back and changed the install options to use the umd build so it wouldn't cause an error when importing via the <script> tag. I'll close this some time tomorrow unless someone still has an issue by then.

[irazasyed]

@redxtech I can confirm it's working good now. Thank you.

As for your question, it is for performance and preference both reasons. This would allow me to lazy load the entire component which relies on vue-plyr when required instead of loading all globally which the component has no use anywhere else. Further, there would be no conflicts with component names in case any other components share the same name now or in future of my own or third-party package. Just keeps components organized and isolated.

[redxtech]

@irazasyed yeah ok that makes complete sense - I completely forgot about lazy loading in this case. Glad it worked out.