Skip to content

Latest commit

 

History

History
158 lines (108 loc) · 4.03 KB

File metadata and controls

158 lines (108 loc) · 4.03 KB

要将 .next 文件夹打包后的 Next.js 项目部署到服务器上,通常需要以下几个步骤:

1. 预备工作:服务器环境配置

确保你的服务器上安装了以下软件:

  • Node.js:Next.js 是基于 Node.js 的框架,所以服务器上必须安装 Node.js。你可以在终端运行以下命令确认 Node.js 是否已安装:

    node -v

    如果没有安装,请参考 Node.js 官网 安装。

  • npm 或 yarn:Node.js 自带 npm,如果你更喜欢使用 yarn,可以通过以下命令安装:

    npm install -g yarn

2. 上传文件到服务器

.next 文件夹和项目的其他相关文件(如 package.jsonnext.config.js 等)上传到服务器。你可以通过以下方式之一上传文件:

  • SFTP:使用工具如 FileZilla,WinSCP,或者通过命令行工具如 scp
  • Git:在服务器上克隆你的项目,或者通过 git pull 拉取更新。
  • FTP:通过 FTP 客户端上传。

3. 安装依赖

进入项目的根目录,并使用以下命令安装项目的依赖(如果还未安装):

  • 如果使用 npm

    npm install
  • 如果使用 yarn

    yarn install

4. 构建项目

在服务器上,你需要先构建 Next.js 项目,这样它才能生成适合生产环境的文件。

npm run build

yarn build

5. 启动应用

构建完成后,可以启动应用进行生产部署。使用以下命令启动 Next.js 项目:

npm start

yarn start

这将启动一个生产环境的 Next.js 服务,默认监听在 3000 端口。如果你需要更改端口,可以通过设置 PORT 环境变量来指定。

例如:

PORT=8080 npm start

6. 配置反向代理(可选)

如果你希望通过 80 端口或 443 端口(HTTP/HTTPS)访问应用,而不直接使用 3000 端口,可以使用 Nginx 或 Apache 配置反向代理。

使用 Nginx 配置反向代理:

  1. 安装 Nginx(如果还没有安装):

    sudo apt-get install nginx  # Ubuntu/Debian 系统
    sudo yum install nginx      # CentOS/RHEL 系统
  2. 编辑 Nginx 配置文件(通常在 /etc/nginx/sites-available/default/etc/nginx/nginx.conf):

    server {
      listen 80;
    
      server_name yourdomain.com;  # 设置你的域名或 IP 地址
    
      location / {
        proxy_pass http://localhost:3000;  # 假设你的 Next.js 应用运行在 3000 端口
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
      }
    }
  3. 重启 Nginx 使配置生效:

    sudo systemctl restart nginx

7. 配置防火墙(可选)

确保防火墙允许 HTTP(80)和 HTTPS(443)端口的访问。你可以通过以下命令检查并开启相关端口:

sudo ufw allow 80,443/tcp   # Ubuntu/Debian
sudo firewall-cmd --add-port=80/tcp --add-port=443/tcp --permanent  # CentOS/RHEL
sudo firewall-cmd --reload

8. 设置自动重启(可选)

为了确保服务器在崩溃后自动重启应用,你可以使用 pm2(进程管理工具)来管理 Node.js 应用。

  1. 安装 pm2

    npm install -g pm2
  2. 启动 Next.js 应用:

    pm2 start npm --name "next-app" -- start
  3. 配置自动重启:

    pm2 startup
    pm2 save

9. 完成部署

到此,你的 Next.js 应用应该已经成功部署到服务器上,并且可以通过域名或 IP 进行访问。

总结

  1. 安装 Node.js 和相关依赖。
  2. 上传 .next 文件夹以及项目文件到服务器。
  3. 在服务器上构建和启动 Next.js 应用。
  4. 配置反向代理和防火墙(如需要)。
  5. 使用 pm2 管理应用进程(可选)。

这就是 Next.js 项目部署的基本步骤。如果你有其他问题,欢迎继续提问!