craigh411 / vue-star-rating

:star: A simple, highly customisable star rating component for Vue 2.x. / 3.x
https://jsfiddle.net/craig_h_411/992o7cq5/
MIT License
660 stars 87 forks source link

Not working in Vue3 at all #76

Open mooseh opened 2 years ago

mooseh commented 2 years ago

Im using version 2.1.0

if i import using createapp, then it breaks the entire compilation of vue saying it cannot call method mount of undefined. if i import it as a component from within a component I get the following errors:

Just for using import StarRating from 'vue-star-rating' you get the following error in console Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'getElementsByTagName') then we actually using the component you get the following error. Uncaught (in promise) TypeError: Cannot read properties of null (reading 'isCE')

is there something i'm missing? I have used this loads of times in vue2 with no issues.

craigh411 commented 2 years ago

Did you definitely install the @next version?

npm install vue-star-rating@next

I know that some people have had some issues with the Vue 3 version, but unfortunately, despite some efforts, nobody has been able to reproduce their problem outside of their projects.

whitersun commented 2 years ago

Me too, In additional. When I am working with typescript (have not tried JavaScript yet), import StarRating from 'vue-star-rating' I got an error from vue-start-rating that said “Could not find a declaration file for module 'vue-star-rating'.” and the package so heavy if I just need to rate. image

craigh411 commented 2 years ago

Me too, In additional. When I am working with typescript (have not tried JavaScript yet), import StarRating from 'vue-star-rating' I got an error from vue-start-rating that said “Could not find a declaration file for module 'vue-star-rating'.” and the package so heavy if I just need to rate. image

The CommonJS file isn't minified because it's assumed minifcation will be done as part of your own build process.

mooseh commented 2 years ago

I have indeed installed the @next version which installs 2.1.0. I have tried everything, I've downgraded to 2.0.3 which ends up with different errors, I think I will have to find an alternative package until this one gets resolved.

tance77 commented 2 years ago

Typescript seems to throw up and say vue-star-rating is undefined or not installed when building for production. However it seems to function in a development environment.

For now I just added //@ts-ignore above the line in questions and it built

maulayyacyber commented 2 years ago

same problem with vue 3 on my project. any update for this package ?

thanks very much

TomBell95 commented 2 years ago

Also facing an error with this, any updates? Thanks

craigh411 commented 2 years ago

I'm going to check this out in one of my Vue 3 projects to see if I can replicate it. To me, this error looks like it comes from the transpilation of the component, but it was transpiled with the Vue CLI using this command:

npx vue-cli-service build --target lib --name VueStarRating ./src/index.js --mode production

For now, one option would be to transpile it yourself by importing ./src/star-rating.vue into your components directly, then including the package in your build config for .vue files, as the node_modules folder is likely going to be excluded. (see: https://webpack.js.org/configuration/module/#condition for how to do this using webpack)

EskimoWolf commented 2 years ago

not sure if this is the issue people are experiencing but if the compiler (webpack for me) option is __VUE_OPTIONS_API__: false then the component doesn't work.

no1621name commented 2 years ago

Hi, everyone. I'm using Nuxt 3 and got the same trouble. I've added to node_modules/vue-star-rating index.d.ts which includes one line "declare module 'vue-star-rating';". It helped me.