ReferenceError: window is not defined

[sigitwp]

Hello @adrienharnay,

My name is sigit, thank you for your ssr starter pack.

I'm new & i have a problem when used this, I get a ReferenceError: window is not defined, when I add a package like mapbox-gl-geocoder.

ReferenceError: window is not defined
    at Object.<anonymous> (/Users/sigit/Documents/workspace/map-dev/node_modules/suggestions/index.js:57:1)
    at Module._compile (module.js:653:30)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3)
    at Module.require (module.js:597:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/sigit/Documents/workspace/map-dev/node_modules/@mapbox/mapbox-gl-geocoder/lib/index.js:3:17)
    at Module._compile (module.js:653:30)

I have tried to resolve this error but still confused, would you mind give me some advice to solve this.

thanks,

[adrienharnay]

Hello,

This error means you are executing client-only code (code that relies on the presence of window) on the server. I believe this module (particularly the suggestions module) needs to be executed on the client. How to do it usually depends on your component architecture, but usually you would return null when on the server, and the component using the library on the client.

Hope this helps!

[ipnuds]

is there any function that can tell if the component on server or client rendering? so we can skip on server rendering.

[adrienharnay]

What I usually use is this:

const isClientSide = () => typeof window !== 'undefined';

Closing this issue for now, feel free to reopen if you need further help!