Vue-material: [1.0.0-beta-5] SSR: document is not defined

[Linzdigr]

Hi,

Just to let you know the situation with vue-material and SSR using the SSR vue.js official guide (with Webpack).

The following happen at the render runtime:

ReferenceError: document is not defined
    at addStyle (foo/node_modules/vue-material/dist/vue-material.js:391:31)
    at addStylesToDom (foo/node_modules/vue-material/dist/vue-material.js:375:20)
    at module.exports (foo/node_modules/vue-material/dist/vue-material.js:329:3)
    at Object.<anonymous> (foo/node_modules/vue-material/dist/vue-material.js:5623:36)
    at __webpack_require__ (foo/node_modules/vue-material/dist/vue-material.js:35:30)
    at Object.defineProperty.value (foo/node_modules/vue-material/dist/vue-material.js:504:1)
    at __webpack_require__ (foo/node_modules/vue-material/dist/vue-material.js:35:30)
    at Object.Op (foo/node_modules/vue-material/dist/vue-material.js:4845:17)
    at __webpack_require__ (foo/node_modules/vue-material/dist/vue-material.js:35:30)
    at module.exports.rawScriptExports (foo/node_modules/vue-material/dist/vue-material.js:78:18)

Am I missing something or SSR implementation still on the way?

Anyway, thanks for your work, also excited with the beta release ;)

[Samuell1]

SSR should be implemented.

Do you get this error without any vue-material code?

[Linzdigr]

Actually it's in a full project using multiple components of vue-material but the error seems to indicate that the problem occurs at the vue-material require in the bundle (so as soon as we import vue-material into it).

[Samuell1]

I looked at it (using Nuxtjs). Looks like there is some problem with something here, but this code its not from VueMaterial source looks like some generated code.

[Samuell1]

@Linzdigr what version of Vue you using?

[Linzdigr]

@Samuell1 Vue 2.5.2

[Linzdigr]

Getting the same issue with vue-server-renderer, vue-template-compiler and vue upgraded to 2.5.9

[Samuell1]

Looks like problem is in vue-style-loader: https://github.com/vuejs/vue-style-loader/blob/master/lib/addStylesClient.js#L116

[marcosmoura]

Which version of Vue Material? Have you tested if with the latest version? Have you tested with the minified version?

[Linzdigr]

@marcosmoura Vue-Material 1.0.0-beta-5 installed via vue-material@beta. I guess the minified version is used as I've set my build setup in production mode.

[Samuell1]

@Linzdigr can you test 1.0.0-beta6?

[Linzdigr]

Sure!
I guess we've done a step forward as the error is now on another module but independent of vue-material.
Considering this solved for now :D
Thanks.

[Samuell1]

@Linzdigr it was weird, vue-style-loader was included in vue-material dist files

[MicroDroid]

I do not use vue-material, but I solved the issue by using vue-style-loader instead of style-loader setting target prop to my Webpack config:

{
  target: 'node',
  ...
}

[MicroDroid]

I am such a genius! Thanks me for writing this comment, I've been drilling the internet until I found this solution. It works perfectly!

<3