Getting "document is not defined" after upgrading to 0.5.6

[goldfire]

We've been using vue-meta with SSR on 0.5.5, but after upgrading to 0.5.6 we started getting the following errors on the server:

ReferenceError: document is not defined
    at updateClientMetaInfo (/path/to/node_modules/vue-meta/lib/vue-meta.js:824:19)
    at Vue$2.refresh (/path/to/node_modules/vue-meta/lib/vue-meta.js:885:35)
    at /path/to/node_modules/vue-meta/lib/vue-meta.js:1013:74
    at Timeout._onTimeout (/path/to/node_modules/vue-meta/lib/vue-meta.js:924:5)
    at ontimeout (timers.js:365:14)
    at tryOnTimeout (timers.js:237:5)
    at Timer.listOnTimeout (timers.js:207:5)

[ziazon]

Same here. Here's my error using 0.5.6 (which I don't get using 0.5.5)

/path/to/project/node_modules/vue-meta/lib/vue-meta.js:824
    var htmlTag = document.getElementsByTagName('html')[0];
                  ^

ReferenceError: document is not defined
    at updateClientMetaInfo (/path/to/project/node_modules/vue-meta/lib/vue-meta.js:824:19)
    at Vue$2.refresh (/path/to/project/node_modules/vue-meta/lib/vue-meta.js:885:35)
    at /path/to/project/node_modules/vue-meta/lib/vue-meta.js:1013:74
    at Timeout._onTimeout (/path/to/project/node_modules/vue-meta/lib/vue-meta.js:924:5)
    at ontimeout (timers.js:380:14)
    at tryOnTimeout (timers.js:244:5)
    at Timer.listOnTimeout (timers.js:214:5)

For now I've reverted back to 0.5.5 but it would be nice to upgrade soon :)

[kasparasg]

^^ having the same issue with an upgrade to 0.5.6

[rhwilr]

Are you guys also using vuex-router-sync?
I am using nuxt.js with vuex-router-sync installed as a plugin and i just found out that if I only include router-sync in the browser-build I don't get the crash.

[darrynten]

@rhwilr exact same problem with vuex-router-sync and 0.5.6 for me - going back to0.5.5 fixes it for me - I'm hesitant to only include it on the client

[goldfire]

Yes, we are using vuex-router-sync as well.

[harvey-woo]

Having the same issue, too, with vuex-router-sync

[euaaaio]

Maybe i'm wrong, but i have the same problem both in the 0.5.5 and 0.5.6

[rhwilr]

I submitted a PR last week which fixes the issue for me. #84
Maybe some of you could check it out and give feedback if it works for you as well so we can get this merged in.

[MaximilianLloyd]

Got the same error, had to downgrade. Kinda strange that a breaking change hasn't been addressed by the repo owner in two weeks :-/.

[cannap]

@MaximilianLloyd maybe busy or holidays 💃

[jazoom]

@rhwilr The interesting thing is that when I made that pull request, it worked fine. I didn't think destroyed() would even be called on the server. I'm not sure why this issue didn't pop up before, because it definitely is now.

Sorry everyone for causing the havoc.

[euaaaio]

@rhwilr , hmm, it works for me(0.5.6), thanks

[shelakel]

This issue is still present, and I've confirmed the fix from @rhwilr solves the issue:
add

// do not trigger refresh on the server side
if (this.$isServer) return

before batchUpdate in destroyed

[corsen2000]

I am not using vue-router-sync, but I am making use of store.registerModule, and it looks like that code is causing the problem. If I do not use registerModule and instead define that module with the initial store everything is fine.

I notice vue-router-sync also makes use of registerModule, so perhaps this issue has something to do with dynamic module registration.

[Atinux]

Should be fixed with vue-meta@1.0.0

[nilsi]

Im still seeing this problem with vue-meta@1.0.0 and above. Using SSR.

W20170515-23:39:52.781(9)? (STDERR)/path/to/project/vue-meteor-demo/node_modules/vue-meta/lib/vue-meta.js:835
W20170515-23:39:52.781(9)? (STDERR)     var htmlTag = document.getElementsByTagName('html')[0];
W20170515-23:39:52.782(9)? (STDERR)                   ^
W20170515-23:39:52.782(9)? (STDERR) 
W20170515-23:39:52.782(9)? (STDERR) ReferenceError: document is not defined
W20170515-23:39:52.783(9)? (STDERR)     at updateClientMetaInfo (/path/to/project/vue-meteor-demo/node_modules/vue-meta/lib/vue-meta.js:835:19)
W20170515-23:39:52.783(9)? (STDERR)     at Vue$3.refresh /path/to/project/vue-meteor-demo/node_modules/vue-meta/lib/vue-meta.js:896:35)
W20170515-23:39:52.784(9)? (STDERR)     at /path/to/project/vue-meteor-demo/node_modules/vue-meta/lib/vue-meta.js:1018:74
W20170515-23:39:52.784(9)? (STDERR)     at [object Object]._onTimeout (/path/to/project/vue-meteor-demo/node_modules/vue-meta/lib/vue-meta.js:935:5)
W20170515-23:39:52.784(9)? (STDERR)     at Timer.listOnTimeout (timers.js:92:15)

[Atinux]

Can you create a step to reproduce this issue @nilsi ?

[nilsi]

What I did was to clone this repo:
https://github.com/Akryum/vue-meteor-demo

I installed vue-meta with:

npm install vue-meta --save

And added imported Meta in app.js:

import Meta from 'vue-meta'
Vue.use(Meta)

Then when I try to access the page Im getting this error

[jacoborus]

I'm experiencing this issue with version 1.0.4, just create a pull request with a fix that worked for me: #101

[camilodelvasto]

I'm also getting this error when running npm run generate, even with vue-meta@1.4.0. Using @jacoborus 's PR works for me locally, but that PR was closed...
Any other solution @Atinux ?

[ismail9k]

I've managed to fix this issue in my own project. The main idea is to prevent the Vue instance from mounting on the server, by removing the el property from the Vue object on the server-side, then mount the Vue instance manually client side

/client/app.js

import Vue from 'vue';

// Meteor Tracker integration
import VueMeteorTracker from 'vue-meteor-tracker'
Vue.use(VueMeteorTracker)

import App from './ui/App.vue'
import router from './router'

function createApp () {
  return {
    app: new Vue({
      // el: '#app', <= REMOVE THIS
      router,
      ...App,
    }),
    router,
  }
}

export default createApp;

/client/startup/index.js

import { Meteor } from 'meteor/meteor'
import CreateApp from './app'

Meteor.startup(() => {
  CreateApp().app.$mount('#app');
})

You can test this on my vue-meteor-boilerplate