CODEWITHSUNDEEP
node.jsvue.jswindowconflictgridsome
Abhishek Singh
Abhishek Singh

Reputation: 21

After upgrading gridsome and node to 18x from 10x ..my build is getting failed "Window is not defined " and running fine on development

After upgrading gridsome and node to 18x from 10x ..my build is getting failed "Window is not defined " and running fine on development. I am using window object at multiple places which was working fine on node 10x version . this issue i am facing with node 18x only.

Error screenshot

tried upgrading gridsome and node versions.

Upvotes: 1

Views: 98

Answers (2)

Abhishek Singh
Abhishek Singh

Reputation: 21

Well, after spending a whopping 72 hours investigating, I discovered that the problem stemmed from the MQ objects from Vue match media (https://github.com/drenglish/vue-match-media) I installed to identify the device my code was running on. However, when working with Gridsome, which generates HTML files at build time by default, the window object was turning up as undefined. Simply removing the MQ object code resolved the issue, and everything started working smoothly.

Upvotes: 0

kissu
kissu

Reputation: 46774

I am not sure if Gridsome is isomorphic (running code on both server and client), but it might be. Overall, any instance of Window on the server will crash because such a thing does not exist there.

The easiest way to fix your project right now: start fresh with Nuxt3 and Node v20 as explained in my other answer here.

Upvotes: 1

Related Questions