Static GitHub Issues

[693] Vue-editor: document is not defined

prev: Using fuse-box instead of webpack?
next: Hope the nuxt.render method has 'data' parameter

If I try to use vue2-editor I get an error

Nuxt.js Error:

ReferenceError: document is not defined
    at i (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:2101)
    at r (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:1923)
    at t.exports (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:3545)
    at Object.t.exports.n (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:262534)
    at e (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:387)
    at Object.t.exports.t (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:261519)
    at e (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:387)
    at Object.defineProperty.value (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:23813)
    at e (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:387)
    at Object.<anonymous> (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:262959)
    at e (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:387)
    at n (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:771)
    at /home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:781
    at n.(anonymous function).i (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:143)
    at Object.<anonymous> (/home/andrey/Projects/node/nuxt-skeditor/node_modules/vue2-editor/dist/index.js:1:264)
    at Module._compile (module.js:570:32)

Include: File EditorPage.vue

<template>
   <div>
     <vue-editor v-model="content"></vue-editor>
   </div>
</template>
 
 <script>
import {VueEditor} from 'vue2-editor'
export default {
  components: {
    VueEditor
  },
  data () {
    return {
      content: '<h1>Some initial content</h1>'
    }
  }
}
</script>

File nuxt.config.js

module.exports = {
  head: {
    title: 'starter',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: 'Nuxt.js project' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },

  loading: { color: '#3B8070' },

  build: { 
    vendor : 'vue2-editor',
    extend (config, ctx) {
      if (ctx.isClient) {
        config.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/
        })
      }
    }
  }
}

If I connect the editor to Vue everything works fine

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c596">#c596</a>)</em></sub></div>