jsPlumb integration with Nuxtjs throwing the error document is not defined

Question

I know there are a few questions similar to this but they did not work for me so I am posting this.

I am trying to add jsPlumb into my Nuxtjs/Vuejs application. I did the following steps:

1. npm i jsplumb --save
2. Create a Vuejs page and add the simple code:

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

<script>
import { jsPlumb } from 'jsplumb'

export default {
  mounted () {
    if (process.client) {
      console.log('MOUNTED - 2')
      jsPlumb.ready(function () {
        console.log('MOUNTED - 3')
      })
    }
  }
}
</script>

I get the error:

ReferenceError
document is not defined

I tried many things which were mentioned but nothing seems to work.

Answer 1

Instead of using process.client I used the process.browser and it worked fine for me. Please refer the link: https://stackoverflow.com/a/69822954/7584240