Vue: SSR document not defined with Vue2.0

Created on 30 Sep 2016  ยท  11Comments  ยท  Source: vuejs/vue

hi, since i updated to Vue 2.0 i get document not defined on server ๐ŸŽฏ
and in Hackernews 2.0 example also

ReferenceError: document is not defined
    at C:\Users\marko\Desktop\Renka\vue-hackernews-2.0-master\node_modules\vue\dist\vue.js:5549:24
    at C:\Users\marko\Desktop\Renka\vue-hackernews-2.0-master\node_modules\vue\dist\vue.js:7:83

not sure its a Vue 2.0 error i dont know how to debug this :/

thanks for Vue its an awesome framework ๐Ÿ‘Š

Most helpful comment

@yyx990803 I agree with @ram-you . I end up forking out most of the libraries and patching them up myself to check for the environment. It would be great if this can be incorporated in Vue itself.

And the way. I am 500% Vue convert. No more framework hells for me. Totally in love with SailsJS and VueJS architecture. Kudos to you and VueJS team.

Regards

All 11 comments

I can confirm, happens even on freshly cloned vue-hackernews-2.0 project. (never happened for RC releases)

Some environment details:

โฏ node -v
v6.7.0

โฏ npm -v
3.10.3

โฏ npm ls | grep vue
vue-hackernews-2.0@ ~/vue-hackernews-2.0
โ”œโ”€โ”€ [email protected]
โ”œโ”€โ”ฌ [email protected]
โ”‚ โ”œโ”€โ”€ [email protected]
โ”‚ โ”œโ”€โ”€ [email protected]
โ”‚ โ”œโ”€โ”€ [email protected]
โ”‚ โ””โ”€โ”€ [email protected]
โ”œโ”€โ”€ [email protected]
โ”œโ”€โ”ฌ [email protected]
โ”œโ”€โ”€ [email protected]
โ”œโ”€โ”€ [email protected]

i checked the dist/vue.js source code its the line dont change this i made this only for me
5549
i changed from
var decoder = document.createElement('div')
to and now it works not sure this will break other stuff but why should it xD
var decoder = inBrowser ? document.createElement('div') : false

Noticed - need to reverting npm main export to commonjs build. fixing soon.

Fixed /w 2.0.1, please do a fresh npm install.

@yyx990803 i import 3rd libary alertifyjs, i get error is ReferenceError: document is not defined when SSR, i don't want to change the code of alertifyjs ,what can i do?

@facesea @yyx990803 +1 , when i import https://github.com/ElemeFE/vue-swipe ,I get error ReferenceError: document is not defined when SSR, what should I do?

@DualWield i had stop SSR, waiting for update:), i used jsdom which can inject dom and window object, but i don't know how to do.

FYI this is not something that Vue can fix - instead, the libraries should prevent accessing window or document directly without checking for the environment first. You should be opening issues in the libraries you want to use regarding this.

@yyx990803 Thank you very much~~

@yyx990803
The majority of libraries uses window or document because they are client-oriented. I think that instead of asking everyone to find a solution to this problem, it is better to think of a global and universal solution that would solve all these problems at a glance. thank you.

@yyx990803 I agree with @ram-you . I end up forking out most of the libraries and patching them up myself to check for the environment. It would be great if this can be incorporated in Vue itself.

And the way. I am 500% Vue convert. No more framework hells for me. Totally in love with SailsJS and VueJS architecture. Kudos to you and VueJS team.

Regards

Was this page helpful?
0 / 5 - 0 ratings