Next.js静态导出无HTML文件问题排查与解决

问题描述 #

我构建了一个功能简单的Next.js应用，未使用Next.js大部分特性，计划通过静态导出方式部署到自有主机。执行命令npm run build（实际执行逻辑为next build && next export）后，生成了.next文件夹和out文件夹，但out文件夹下仅有/static、/chunks、/css、/media这些子文件夹，没有生成预期的静态HTML文件。我已在next.config.js中配置output: "export"，但问题仍存在。

解决方案 #

经排查，问题根源在于Next.js默认启用的图片优化功能——该功能依赖服务器环境支持，而静态网站无需此功能。在next.config.js中添加以下配置禁用图片优化后，静态HTML文件可正常生成：

module.exports = {
  images: {
    unoptimized: true,
  },
}

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