Next.js构建后执行npm start报错：找不到生产构建文件，求解决

核心问题 #

当你在next.config.js中配置了output: 'export'后，Next.js会生成纯静态的HTML/CSS/JS文件，而next start命令是用来启动Next.js的Node.js服务端渲染进程的，它不支持托管静态导出的产物，这就是你报错的根本原因。

正确的启动方式 #

你需要用静态文件服务器来托管out目录，推荐几种简单方案：

• 使用serve工具：
  1. 全局安装：npm install -g serve
  2. 启动服务：serve out
• 使用Python（已安装的话）：
  • Python 3：python -m http.server --directory out
  • Python 2：python -m SimpleHTTPServer --directory out
• 使用http-server工具：
  1. 全局安装：npm install -g http-server
  2. 启动服务：http-server out

额外优化建议 #

• 简化构建命令：Next.js 13.3+ 配置output: 'export'后，执行next build会自动完成静态导出，不需要再额外加next export命令，所以你的package.json中build脚本只需写"build": "next build"即可。
• 确认next.config.js配置正确，示例如下：

  /** @type {import('next').NextConfig} */
  const nextConfig = {
    output: 'export',
    distDir: 'out',
    // 其他项目配置
  }
  
  module.exports = nextConfig
  

• 检查out目录下是否生成了index.html及其他静态资源文件，确保构建过程没有异常。

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