self not defined when trying to use jsoneditor

234 Views Asked by At

I installed jsoneditor using npm and as soon as I try to include it in my nuxtjs app it will complain with given error:

 FATAL  self is not defined                                                                                                          17:02:41  

  at node_modules\jsoneditor\dist\jsoneditor.min.js:30:237
  at Resolver.g [as _require] (node_modules\jiti\dist\jiti.js:1:55131)
  at Resolver.requireModule (node_modules\@nuxt\core\dist\core.js:381:29)
  at ModuleContainer.addModule (node_modules\@nuxt\core\dist\core.js:182:38)
  at node_modules\@nuxt\utils\dist\utils.js:639:43
  at async ModuleContainer.ready (node_modules\@nuxt\core\dist\core.js:51:7)
  at async Nuxt._init (node_modules\@nuxt\core\dist\core.js:478:5)

Does anybody know how can I debug this issue ?

The installation command was npm install jsoneditor --save

My nuxt code looks like this in the nuxt.config.js file:

modules: [
  // https://go.nuxtjs.dev/bootstrap
  'bootstrap-vue/nuxt',
  // https://go.nuxtjs.dev/axios
  '@nuxtjs/axios',
  'jsoneditor'
]

EDIT

I tried to do as described below based on thread: https://github.com/yansenlei/VJsoneditor/issues/52 but still did not work:

Steps as below:

Create a new file named: json-editor.js and place it in the plugins folder

In the plugins section in nuxt.config.js file place:

plugins: [ { src: '~/plugins/json-editor', mode: 'client' } }

Import the component accordingly using:

import VJsoneditor from 'v-jsoneditor' ... components: { VJsoneditor }

And use it:

<VJsoneditor v-model="val" :plus="true" .../>

0

There are 0 best solutions below