Next.js项目执行npm run build后未生成build文件夹或路径异常咨询

Next.js默认执行npm run build后会将构建产物放在.next目录，而非build文件夹。要生成适合FTP托管的静态build文件夹，按以下步骤操作：

1. 修改构建命令指定输出目录 #

编辑项目根目录下的package.json，将build脚本改为指定输出目录的命令：

{
  "scripts": {
    "build": "next build --out-dir build"
  }
}

执行npm run build后，项目根目录会直接生成build文件夹，包含所有优化后的静态文件。

2. 开启静态导出模式（适配FTP托管） #

如果你的FTP环境仅支持静态文件托管（无需Node.js服务器），需在next.config.js中添加静态导出配置：

/** @type {import('next').NextConfig} */
const nextConfig = {
  // 启用静态导出，生成纯静态资源
  output: 'export',
  // 可选：禁用Next.js内置图片优化（若托管环境不支持对应服务）
  images: {
    unoptimized: true,
  },
}

module.exports = nextConfig

注意：静态导出模式不依赖Node.js运行时，因此**不支持API路由、getServerSideProps、增量静态再生（ISR）**等特性。如果项目使用了这些功能，需替换为静态兼容方案（比如getStaticProps），或更换为支持Node.js的托管方式。

3. 验证构建结果 #

执行npm run build后，检查项目根目录的build文件夹，里面会包含HTML、CSS、JS等所有静态资源，直接将整个文件夹上传到FTP服务器即可完成托管。

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