Vue.js Server Side Rendering: document is not defined

Question

I am using a package which uses document and window. I want to make my website have server-side rendering without changing too much code. For window is not defined, I use window-or-global (https://www.npmjs.com/package/window-or-global) and it solves my problem.

However, when it comes to document, I actually don't find anything useful. My idea is try to find out when the server or the client is rendering. I will only execute the code with document when the client is rendering. Is there any way to do that?

P/S: I am using Vue.js 2.0. The package I am using is fine-uploader (https://www.npmjs.com/package/fine-uploader)

Answer 1

I'm also using Vue Server Side rendering in a new project, and what I do for this kind of problem is that I check if I am in the browser environment or in the server one using:

if (typeof window !== 'undefined') {
    // We are in the browser
}

Answer 2

You can use

const Vue = require('vue');
Vue.prototype.$isServer

or from within a component

this.$isServer