Next.js静态生产构建完成后无build文件夹，构建是否成功？

我执行npm run build创建Next.js静态生产构建，输出日志如下：

info - Creating an optimized production build
info - Compiled successfully
info - Collecting page data
info - Generating static pages (5/5)
info - Finalizing page optimization Page Size First Load JS

• List item
  ┌ ○ /
  261 B 222 kB
  ├ /_app 0 B 222 kB
  ├ ○ /404 194 B 222 kB
  ├ ○ /dashboard 236 B 222 kB
  └ ○ /sign-in 514 B 222 kB

First Load JS shared by all 222 kB
├ chunks/framework-5f4595e5518b5600.js 42 kB
├ chunks/main-c586b89e07064d4a.js 27.9 kB
├ chunks/pages/_app-ff5b9dd4b852de7e.js 150 kB
└ chunks/webpack-d3b4bbaea9693629.js 1.72 kB

○(Static) automatically rendered as static HTML (uses no initial props)

但项目根目录里找不到build文件夹，期望构建成功后在根目录生成该文件夹。

解决方法 #

1. 检查默认输出目录 #

Next.js 12及更早版本，静态构建的默认输出目录是out而非build。先去项目根目录查看是否存在out文件夹，里面就是构建好的静态产物。

2. 自定义输出目录为build #

如果需要指定生成build文件夹，在项目根目录的next.config.js中添加以下配置：

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'export',
  distDir: 'build',
}

module.exports = nextConfig

保存配置后重新执行npm run build，构建产物就会生成在build文件夹中。

3. 确认构建状态 #

从日志内容判断，构建流程已经完整执行（编译成功、静态页面生成完成），不存在构建失败的情况，只是输出目录和你的预期不一致。

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