NextJS项目执行npm run build报错，求解决方案

核心问题：构建阶段触发document is not defined错误，原因是代码在无浏览器环境的构建环节调用了浏览器专属API。

修复步骤：

• 检查page.tsx及其他组件代码，确保document/window这类API仅在浏览器端执行：
  1. 用useEffect包裹浏览器API调用，确保只在客户端渲染时执行：

     import { useEffect } from 'react';
     
     export default function Home() {
       useEffect(() => {
         // 此处编写需要document的逻辑，比如创建标签
         const newTag = document.createElement('div');
         // ...后续操作
       }, []);
     
       return <div>主页面内容</div>;
     }
     

  2. 若组件依赖浏览器环境，用NextJS动态导入禁用SSR：

     import dynamic from 'next/dynamic';
     
     const ClientComponent = dynamic(() => import('./ClientComponent'), { ssr: false });
     

• 排查第三方依赖：如果是第三方库引发的问题，确认其是否支持静态构建，或切换到客户端专属的导入方式。
• 清理构建缓存：删除.next文件夹后重新执行npm run build，排除缓存异常。

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