jsplumb in Nuxt app throws document is not defined

I am planning to use jsplumb in my app

my current code looks like this

<template>
  <client-only>
    <div id="canvas"></div>
  </client-only>
</template>

<script>
import { jsPlumb } from 'jsplumb'

export default {
  name: 'JsPlumb',
  auth: false,
  mounted() {
    jsPlumb.ready(function () {})
  }
}
</script>

when I run my app, this throws an error of document is not defined. I already found out that jsplumb wont work on SSR. How can I achieve it to use import for jsplumb that it wont throw an error. Is there a dynamic import in nuxt that only imports the library in non-ssr?



Read more here: https://stackoverflow.com/questions/67919419/jsplumb-in-nuxt-app-throws-document-is-not-defined

Content Attribution

This content was originally published by Rashid at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: