Next.js Discord

Discord Forum

window is not defined only on edge runtime

Answered
American Crocodile posted this in #help-forum
Open in Discord
American CrocodileOP
Whenever I set export const runtime = "edge"; on my route, I get the error below. I don't get the error without setting runtime to edge, any instances of window that I use are either in onClick or useEffects, and I don't see any references to my actual code within the error, so I don't think its specifically something my code is doing.

The error doesn't actually prevent the site from running in dev mode, and the error message only appears in the terminal where I run it, not on the site itself(except the dev console shows a GET request to the page gives a 500 (Internal Server Error)).
It also deploys just fine on cloudflare pages..

Error(too long to post here): https://hastebin.skyra.pw/qudufoqetu.less
Answered by Northeast Congo Lion
is to use dynamic() where ur importing the erroring component
View full answer

36 Replies

can u shar ecode?
@!=tgt try accessing the `window` object in a useEffect
American CrocodileOP
@Northeast Congo Lion as I said in my post, the only place I use window is within onClick and useEffect's. I have a lot of code so nothing really specific I think I could send that'd be useful, but there is 100% nowhere in the code I wrote a use of window that'd be run on the server(assuming useEffect and onClick don't, which I'd imagine they never would)

Again, the issue only happens if I use the edge runtime, if I was using window somewhere that it'd run on the server, id imagine it'd error no matter what runtime I'm on.
Also, typically if something like that happens(using window when it renders server side), it'd tell me where in the code the error is, but again the error doesn't reference my own code at all
Northeast Congo Lion
a workaround would be
if (typeof window !== 'undefined') ur logic here
ive used this a couple times where ive faced some weird, unsolvable issues similar to urs
@Northeast Congo Lion if (typeof window !== 'undefined') ur logic here
American CrocodileOP
I just put that around the 3 places I use window and the exact same error
Northeast Congo Lion
huh
American CrocodileOP
I really don't think it's my use of window that is causing the issue...
(and yes if you're wondering I searched my entire project for window)
Northeast Congo Lion
it may not be u using window directly
ive had this issue before i swear
it did almost kill me lol
its kinda difficult to help without the soure code, my only advice would be to do a process of elimination on your components
e.g, remove some components and monitor the issue, then you can narrow done which exact component is causing u problems
it's not great, but for ambigious errors like this, sometimes u gotta get ugly 🤷‍♂️
American CrocodileOP
Alright doing that actually it seems like it's just straight up the react-dnd context provider causing it 🙃
sometimes its an ugly ass way to do it
but it sure gets the job done!
glad u found the issue at least
American CrocodileOP
except that I have no clue why react-dnd would do that and there's seemingly no issues on their github about it 😅
guess that's an issue for their discord then though
Northeast Congo Lion
it needs to use window
are u using use client where it is used?
American CrocodileOP
yup
Northeast Congo Lion
huhhhh
aint that groovy baby
:pepe_cry:
American CrocodileOP
i just straight up returned 
<DndProvider backend={HTML5Backend}>
            <div>hi</div>
</DndProvider>

and still got the error
Northeast Congo Lion
my only last suggestion before im outta ideas
Northeast Congo Lion
is to use dynamic() where ur importing the erroring component
Answer
American CrocodileOP
heh that fixed it
feel like that shouldn't be necessary but very much appreciated suggestion haha
Northeast Congo Lion
sweet