vue3 setup error render?

[everyPassion]

when i init component write setup function cause error?

[gbrian]

It looks not compatible with VUE 3

[Vue warn]: Property "$createElement" was accessed during render but is not defined on instance.

Found same issues and workaorunds from other projects:
nhn/tui.editor#1226 (comment)

[Sanan4li]

facing the same error when using the basic component in Vue 3.2

[R0ad-Runn3r]

facing the same error when using the basic component in Vue 3.2

Hey,

I have the same problem / error-message like @Sanan4li

[tomeraz]

Same here, any update on this?

[SHIXUNXUN]

same question

[qujinxing-s]

use vue3 ，The same problem

[Fine0830]

Please use "npm i -s vue-drag-resize@next" for use in Vue3. #102 (comment)

[qujinxing-s]

谢谢，收到了。

[calebwaldner]

I'm getting an error in Vue 3 still. Using "vue-drag-resize": "^2.0.3"

I'm also using Nuxt 3, maybe that's part of the problem?

Error states:

ReferenceError: self is not defined
    at Object.<anonymous> (/Users/calebwaldner/Code/galaxy-forms-web/node_modules/vue-drag-resize/dist/index.js:1:241)
    at Module._compile (internal/modules/cjs/loader.js:1085:14)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
    at Module.load (internal/modules/cjs/loader.js:950:32)
    at Function.Module._load (internal/modules/cjs/loader.js:790:14)
    at ModuleWrap.<anonymous> (internal/modules/esm/translators.js:199:29)
    at ModuleJob.run (internal/modules/esm/module_job.js:169:25)
    at async Loader.import (internal/modules/esm/loader.js:177:24)
    at async __instantiateModule__ (file:///Users/calebwaldner/Code/galaxy-forms-web/.nuxt/dist/server/server.mjs:21337:3)
[Vue Router warn]: uncaught error during route navigation:
Error: [vite dev] Error loading external "/Users/calebwaldner/Code/galaxy-forms-web/node_modules/vue-drag-resize/dist/index.js".
    at file:///Users/calebwaldner/Code/galaxy-forms-web/.nuxt/dist/server/server.mjs:20665:297
    at async __instantiateModule__ (file:///Users/calebwaldner/Code/galaxy-forms-web/.nuxt/dist/server/server.mjs:21337:3)
[vite dev] Error loading external "/Users/calebwaldner/Code/galaxy-forms-web/node_modules/vue-drag-resize/dist/index.js".
  at file://./.nuxt/dist/server/server.mjs:20665:297
  at async __instantiateModule__ (file://./.nuxt/dist/server/server.mjs:21337:3)
(node:47332) UnhandledPromiseRejectionWarning: Error: [vite dev] Error loading external "/Users/calebwaldner/Code/galaxy-forms-web/node_modules/vue-drag-resize/dist/index.js".
    at file:///Users/calebwaldner/Code/galaxy-forms-web/.nuxt/dist/server/server.mjs:20665:297
    at async __instantiateModule__ (file:///Users/calebwaldner/Code/galaxy-forms-web/.nuxt/dist/server/server.mjs:21337:3)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:47332) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 3)
(node:47332) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
[Vue Router warn]: uncaught error during route navigation:
TypeError: Cannot read property '__vccOpts' of undefined
    at /Users/calebwaldner/Code/galaxy-forms-web/node_modules/vue-router/dist/vue-router.cjs.js:2022:55
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
Cannot read property '__vccOpts' of undefined
  at ./node_modules/vue-router/dist/vue-router.cjs.js:2022:55
  at processTicksAndRejections (internal/process/task_queues.js:95:5)
(node:47332) UnhandledPromiseRejectionWarning: TypeError: Cannot read property '__vccOpts' of undefined
    at /Users/calebwaldner/Code/galaxy-forms-web/node_modules/vue-router/dist/vue-router.cjs.js:2022:55
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
(node:47332) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 7)

Thanks for any help resolving this.

[qujinxing-s]

谢谢，收到了。

[lnixz]

VUE 3:

npm i -s vue-drag-resize@next

Introduce dependent components directly into the parent component.

// demo.vue
<script setup lang="ts">
    import VueDragResize from 'vue-drag-resize/src/component/vue-drag-resize.vue';
</script >

<template>
    <VueDragResize :w="200"  :h="120" >
        Hello World
    </VueDragResize>
</template>

[qujinxing-s]

谢谢，收到了。

[r0hit5292]

getting this error when i am trying to import this in my nuxt3 project

[qujinxing-s]

谢谢，收到了。

[r0hit5292]

Please use "npm i -s vue-drag-resize@next" for use in Vue3. #102 (comment)

still not working

[qujinxing-s]

谢谢，收到了。