Next.js项目出现'window is not defined'错误，请求技术协助

你的问题出在：Next.js服务端渲染阶段不存在window对象，而代码里的window.addEventListener和window.removeEventListener是直接在useEffect顶层执行的，服务端渲染时会触发这两行代码导致报错——虽然你在handleScroll里加了window判断，但那只是函数内部的逻辑，外层的监听注册代码还是会在服务端运行。

修复后的代码如下：

useEffect(() => {
  // 仅在客户端环境下执行滚动监听逻辑
  if (typeof window !== 'undefined') {
    const handleScroll = () => {
      setActive(window.scrollY > 100);
    };

    window.addEventListener('scroll', handleScroll);

    return () => {
      window.removeEventListener('scroll', handleScroll);
    };
  }
}, []);

说明：把整个滚动监听的注册、处理函数定义和销毁逻辑都包裹在typeof window !== 'undefined'判断里，这样服务端渲染时会直接跳过这段代码，只有在浏览器端才会执行，彻底避免window未定义的错误。

内容的提问来源于stack exchange，提问作者Lewis Wachira