`window is not defined` throws on client-side mode

[zdunecki]

I'm using React Router as a...

framework

Reproduction

I prepared a repo where this error happened, more precisely this line throws an error

System Info

window is not defined
    at eval (/Users/zdunecki/Code/zdunecki/bolt.diy/my-react-router-app/app/routes/home.tsx:9:13)
    at instantiateModule (file:///Users/zdunecki/Code/zdunecki/bolt.diy/my-react-router-app/node_modules/vite/dist/node/chunks/dep-CHZK6zbr.js:52974:5

Used Package Manager

pnpm

Expected Behavior

I want to expect that in client-side mode I would be able to use window object outside of the render function. Some libraries do use window related objects outside of the render and after importing such as libraries rr7 throws an error.

I dit not tested library version of rr7 but as the framework is more powerful and there's a client-side version it would be awesome to support window object.

Actual Behavior

When I do window outside of render and use ssr:false rr7 throws an error.

[timdorr]

Even when ssr: false is set, we still need to build a server bundle to render the base HTML to a file so that it can be served statically.

If you want to use browser-only APIs, you should use a .client module: https://reactrouter.com/explanation/special-files#client-modules

[zdunecki]

Even when ssr: false is set, we still need to build a server bundle to render the base HTML to a file so that it can be served statically.

If you want to use browser-only APIs, you should use a .client module: https://reactrouter.com/explanation/special-files#client-modules

Such a good news, appreciated!

@timdorr
IMO this information should be closer/linked with information about client-side rendering strategies. If someone is interested in client-side mode expect a behavior like a normal SPA application and objects like window are just usual.
The only Special Files section for such information may be a little hard to find.