1. Home
  2. Articles
  3. 👨🏻‍💻 "window" is not available during server-side rendering.

👨🏻‍💻 "window" is not available during server-side rendering.

Enable "DEV_SSR" to debug this during "gatsby develop".

Misal ada code seperti ini

const [isDesktop, setIsDesktop] = useState(
  window.matchMedia("(min-width: 800px)").matches
);

ubah dan tambahkan conditional if pada code tersebut, misal seperti ini

const [isDesktop, setIsDesktop] = useState(false);
useEffect(() => {    
  if (typeof window !== "undefined") {      
    const mediaQuery = window.matchMedia("(min-width: 800px)");         
    setIsDesktop(mediaQuery.matches);
      
    const handleChange = (e) => { 
      setIsDesktop(e.matches);
    };
      
    // Event listener setup      
    window.addEventListener("resize", handleChange);
      
    // Cleanup      
    return () => {
      window.removeEventListener("resize", handleChange);      
    };    
  }  
}, []);
🌐 ryanuiux.com