Open
Description
I created a new vue3 project with the package.json listed below in cli3.
then I integrated the MultiGesture.vue, but I always get an error. what could be the reason for this?
is there a demo project in cli
in ./node_modules/@vueuse/motion/dist/index.mjs
Module not found: Error: Can't resolve 'defu' in 'E:\_projekte\PRIGNITZMUSEUM_HAVELBERG\P7_SIEDLUNGSGESCHICHTE\vuemotion-typescript\node_modules\@vueuse\motion\dist'
ERROR in ./node_modules/@vueuse/motion/dist/index.mjs 11:0-24
Module not found: Error: Can't resolve 'defu' in 'E:\_projekte\PRIGNITZMUSEUM_HAVELBERG\P7_SIEDLUNGSGESCHICHTE\vuemotion-typescript\node_modules\@vueuse\motion\dist'
@ ./src/main.ts 6:0-46 7:61-73
webpack compiled with 1 error
ERROR in src/components/_VueImagePinch.vue:55:35
TS7031: Binding element 'x' implicitly has an 'any' type.
53 | const motions = useMotions();
54 |
> 55 | const handler = ({ movement: [x, y], dragging }) => {
| ^
56 | // Check element existence
57 | if (!motions.demo) return;
58 |
package.json
{
"name": "vuemotion-typescript",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@vueuse/core": "^11.0.1",
"@vueuse/gesture": "^2.1.0",
"@vueuse/motion": "^2.2.3",
"core-js": "^3.8.3",
"vue": "^3.2.13",
"vue-class-component": "^8.0.0-0",
"vue-router": "^4.0.3",
"vuex": "^4.0.0"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-plugin-router": "~5.0.0",
"@vue/cli-plugin-typescript": "~5.0.0",
"@vue/cli-plugin-vuex": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"@vue/eslint-config-typescript": "^9.1.0",
"eslint": "^7.32.0",
"eslint-plugin-vue": "^8.0.3",
"sass": "^1.32.7",
"sass-loader": "^12.0.0",
"typescript": "~4.5.5"
}
}
main.ts
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import { GesturePlugin } from '@vueuse/gesture'
import { MotionPlugin } from '@vueuse/motion'
createApp(App).use(store).use(router).use(GesturePlugin).use(MotionPlugin).mount('#app')
Metadata
Assignees
Labels
No labels