I am refactoring an application from Nuxt2 to Nuxt3 and I use PanZoom for panning and zooming a specific div. My package.json looks like below
{ "private": true, "scripts": { "build": "nuxt build", "dev": "nuxt dev", "generate": "nuxt generate", "preview": "nuxt preview", "postinstall": "nuxt prepare" }, "devDependencies": { "nuxt": "^3.0.0" }, "dependencies": { "vue-panzoom": "^1.1.6" } }
as proposed, I use the plugin folder to declare my panzoom plugin like
import panZoom from 'vue-panzoom' export default defineNuxtPlugin((nuxtApp) => { nuxtApp.vueApp.use(panZoom) })
I do not declare the plugin in the nuxt.config.ts file as Nuxt 3 auto-configures plugins.
then I try to test the installation with a snippet like
<panZoom> <img src="https://picsum.photos/300"> </panZoom>
This does not work. The console.log shows
Cannot create panzoom for the current type of dom element
this shows that Nuxt foundn the panzoom plugin, but cannot use it for a reason unknown to me.
Can anybody help me on this. Thanks i advance
see details of problem
