Isn't working in Vue 3 with latest v5
See original GitHub issueOn a new install of Vuejs 3, I cannot get this to run.
<template>
...
<vue-cropper ref="cropper" :src="imgSrc" alt="Source Image"></vue-cropper>
...
</template>
<script lang="ts">
...
import VueCropper from 'vue-cropperjs'
import 'cropperjs/dist/cropper.css'
...
@Component({
components: {
VueCropper,
},
...
})
...
</script>
Error in console:
[Vue warn]: Error in render: "TypeError: (0 , _vue.h) is not a function
TypeError: (0 , _vue.h) is not a function at Proxy.render (VueCropper.js?95c3:23) at VueComponent.Vue._render (vue.runtime.esm.js?2b0e:3548) at VueComponent.updateComponent (vue.runtime.esm.js?2b0e:4066) at Watcher.get (vue.runtime.esm.js?2b0e:4479) at new Watcher (vue.runtime.esm.js?2b0e:4468) at mountComponent (vue.runtime.esm.js?2b0e:4073) at VueComponent.Vue.$mount (vue.runtime.esm.js?2b0e:8415) at init (vue.runtime.esm.js?2b0e:3118) at createComponent (vue.runtime.esm.js?2b0e:5978) at createElm (vue.runtime.esm.js?2b0e:5925)
vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in mounted hook: “Error: The first argument is required and must be an or <canvas> element.” Error: The first argument is required and must be an or <canvas> element. at new Cropper (cropper.js?bab4:3223) at VueComponent.mounted (VueCropper.js?95c3:159) at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854) at callHook (vue.runtime.esm.js?2b0e:4219) at Object.insert (vue.runtime.esm.js?2b0e:3139) at invokeInsertHook (vue.runtime.esm.js?2b0e:6346) at VueComponent.patch [as patch] (vue.runtime.esm.js?2b0e:6565) at VueComponent.Vue._update (vue.runtime.esm.js?2b0e:3948) at VueComponent.updateComponent (vue.runtime.esm.js?2b0e:4066) at Watcher.get (vue.runtime.esm.js?2b0e:4479)
I do have dependency installed for types
"@types/vue-cropperjs": "^4.1.1",
Issue Analytics
- State:
- Created 3 years ago
- Comments:5 (2 by maintainers)
Top GitHub Comments
Also having the same issue using the example file. Previous version (4.2.0) works fine though. Nice work.
What’s wrong with v4.2.0 ? It works fine with vue 2. It’s not possible to make v5 compatible with vue 2 because vue 3 has breaking changes in render function API.
https://v3.vuejs.org/guide/migration/render-function-api.html#overview