Support vue 3
bzd2000 opened this issue · 12 comments
Hello,
Is there any plan to foresee a next branch for vue 3?
thx,
Filip
Hello, @bzd2000. I've not tried yet this library with Vue 3. Have you encountered any troubles?
Yes, it doesn't work currently. It doesn't load and breaks the application.
There are some breaking changes -> https://v3.vuejs.org/guide/migration/introduction.html#overview
(also plugin system changed)
I managed to copy the Cropper component (with all sources) in a vue 3 project and with some minor adjustments it seems to work in my use case. So I think it want be a huge work to migrate it.
I forked your project and try to update all necessary dependencies to vue 3, but got stuck on the rollup config.
It cannot load the the scss part of the vue files for some reason. Maybe due some of the rollup-plugins it uses.
So if you would be able to create an next branch, I could merge it with updated dependencies and then you could maybe check what is wrong.
kr,
Filip.
I will try to preserve one branch and save backward compatibility. But I need time to investigate this problem, so I think I delay this task to next weekend.
@bzd2000 the version of rollup-plugin-vue compatible with the next version of Vue is in the beta stage. It has at least one
the painful issue right now.
ok :)
that was exact the issue I had too
Seems like they have 1 commit related to style since beta 9 (beta 11 as of now). Also there is a mention vite.
I am sorry, I think rollup-plugin-vue actually just got out of beta. It's 6.0.0 now. The setting in the rollup.config.js should have the plugin portion like this (sort of explained in the readme of the plugin).
Vue({
preprocessStyles: true
}),
Then you will change the index.js to adopt the new vue 3 way (createApp() etc.).
On my computer, it compiles fine, passed all test as a standalone and compiles fine in my own project, too. But it started to throw errors when I really make use of the library. I hope this is just my project and I will continue to check.
For me importing vue-advanced-cropper in ionic/vue3 project breaks the app (without any specific errors logged to the console).
I've started work on the adaption to the breaking changes in Vue 3. It works already now, but it's pretty raw, just like the ecosystem of the last Vue version.
Please note that:
- This version is not backward compatible with Vue 2. I'm not sure that it's even possible.
- This branch includes breaking-changes of this library. Their description I will publish somewhere later.
@bzd2000, @phena109, @alekbarszczewski finally, it has arrived. The vue-advanced-cropper is available for Vue 3 now.
npm install --save vue-advanced-cropper@nextyarn add vue-advanced-cropper@nextIf you have used the beta version before, please read the migration guide also.
@bzd2000, @phena109, @alekbarszczewski, I close the issue. If you encounter any troubles, feel free to create the specific issue.
Thx for the work!