konvajs / vue-konva

Vue & Canvas - JavaScript library for drawing complex canvas graphics using Vue.
https://konvajs.github.io/docs/vue/
MIT License
1.17k stars 130 forks source link

Unable to use in nuxt 3 #251

Open odetolakehinde opened 1 week ago

odetolakehinde commented 1 week ago

Error:

image

package.json

"dependencies": {
    "fabric": "^6.4.3",
    "konva": "^9.3.15",
    "nuxt": "^3.13.0",
    "vue": "latest",
    "vue-konva": "^3.1.2",
    "vue-router": "latest"
  }

plugins/konva.ts

import VueKonva from 'vue-konva';

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(VueKonva)
})

nuxt.config.ts

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  compatibilityDate: '2024-04-03',
  devtools: { enabled: true },
  plugins: [{src: '~/plugins/konva.js', mode: 'client'}],
  build: {transpile: ['konva']},
})
lavrton commented 1 week ago

Please make a small repository to reproduce.

The quick solution can be just installing canvas library: npm install canvas@next.

odetolakehinde commented 1 week ago

here's a repo - https://github.com/odetolakehinde/nuxt-konva

this does not seem to work:

yarn add canvas@next
odetolakehinde commented 1 week ago

cc @lavrton