如何将Next.js应用部署到Ionos服务器？

一、静态导出（无需Node.js服务器，贴近CRA体验） #

如果你不需要Next.js的SSR/SSG/ISR特性，完全可以像CRA一样导出纯静态文件，步骤如下：

1. 修改next.config.js，添加静态导出配置：

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'export',
  // 若部署在子路径，需配置basePath，比如basePath: '/blog'
}

module.exports = nextConfig

2. 执行npm run build，项目根目录会生成out文件夹（替代CRA的build文件夹）
3. 将out文件夹内所有内容上传到Apache服务器的网站根目录（比如Ionos的htdocs文件夹）
4. 配置Apache URL重写解决单页路由问题：
   在网站根目录创建.htaccess文件，写入以下内容：

RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

二、Vercel一键部署（官方推荐的最简方式） #

Vercel是Next.js官方平台，部署流程如下：

1. 将你的Next.js代码上传到GitHub/GitLab/Bitbucket仓库
2. 登录Vercel官网，用对应仓库账号授权登录
3. 点击「New Project」，选中你的Next.js仓库
4. 无需额外配置，直接点击「Deploy」完成部署，之后可在项目设置的「Domains」中绑定自己的Ionos域名，按照提示在Ionos后台配置DNS解析即可。

三、需SSR/SSG特性时的Apache部署方案 #

若项目依赖Next.js的SSR等动态特性，需在服务器运行Node.js服务：

1. 在Ionos服务器上安装Node.js：
   Ubuntu/Debian系统执行：apt install nodejs npm
   CentOS系统执行：yum install nodejs npm
2. 上传项目代码到服务器，执行npm install和npm run build
3. 用PM2管理Node.js进程（防止终端关闭后服务停止）：
   • 安装PM2：npm install -g pm2
   • 启动服务：pm2 start npm --name "your-next-app" -- start
4. 配置Apache反向代理，将域名请求转发到Next.js服务端口（默认3000）：
   在.htaccess或Apache虚拟主机配置中添加：

ProxyPass / http://localhost:3000/
ProxyPassReverse / http://localhost:3000/

先启用Apache代理模块：a2enmod proxy proxy_http，再重启Apache服务。

内容的提问来源于stack exchange，提问作者Lucie Bachman