Next.js 打包输出及部署

Next.js 打包
默认打包

npm run build

默认打包生成.next文件夹
本机部署，继续执行

npm run start

启动服务器
访问http://localhost:3000 or 本机ip 3000端口即可见到已部署的页面

如需要其他服务器部署
copy .next、node_modules、public、package.json四个文件到服务器
（服务器需要有兼容对应next版本所需的node环境）
执行

npm run start

启动服务，ip+3000端口访问页面

仅需导出静态资源文件
next支持仅导出静态资源。
运行 next build 时，Next.js 为每个路由生成一个 HTML 文件。通过将严格的 SPA 分解为单独的 HTML 文件，Next.js 可以避免在客户端加载不必要的 JavaScript 代码，从而减小捆绑包大小并加快页面加载速度。
要启用静态导出，需要先修改 next.config.js 中的输出模式

/** @type {import('next').NextConfig}*/
const nextConfig = {
  output: 'export',
  // Optional: Change the output directory `out` -> `dist`
  // distDir: 'dist',
}
 
module.exports = nextConfig

自定义导出目录文件夹名称 设置distDir 字段，默认导出到out文件夹
导出内容包含应用程序的 HTML/CSS/JS 资源

Next.js支持独立部署
修改next.config.js 中的输出模式

module.exports = {
  output: 'standalone',
}

修改之后，执行

npm run build

next build 执行生成 .next/standalone文件夹
该文件夹仅复制生产部署所需的必要文件，包括 node_modules 中的选定文件。可以单独部署该文件夹。
.next/standalone 文件夹内还有一个最小的 server.js 文件，可以用作 next start 的替代方案。但由于next.js打包方式及server.js 均不复制 public 或 .next/static 文件夹，这里可以手动复制，也可以修改package.json中的script 或直接终端操作

cp -r .next/static .next/standalone/.next/static && cp -r public .next/standalone/public && cross-env PORT=8080 HOSTNAME=127.0.0.1 node .next/standalone/server.js

Windows系统

xcopy .next/static .next/standalone/.next/static && xcopy public .next/standalone/public && cross-env PORT=8080 HOSTNAME=127.0.0.1 node .next/standalone/server.js

访问 http://127.0.0.1:8080

参考文档：
静态导出
独立部署