前言

本文基于：操作系統 CentOS Stream 8
使用工具：Xshell8、Xftp8

服務器基礎環境：

• node - 請查看 linux安裝node并全局可用
• pm2 - 請查看 linux安裝pm2并全局可用
• nginx - 請查看 linux 使用nginx部署vue、react項目

所需服務器基礎環境，請根據提示進行下載、安裝。

1.上傳項目文件

除 node_modules 之外的項目文件上傳至服務器，服務器目錄路徑可以自定義，后續步驟需對應修改

2.安裝依賴

cd /var/www/project

npm install

3.項目打包

npm run build

4.使用 pm2 啟動項目

pm2 start npm --watch --name next.js -- start

說明

• pm2 start: 啟動命令
• npm: 包管理器(如使用的是yarn，那么這里的 npm 就替換成yarn)
• –watch: 監控文件變化并自動重啟應用
• –name: 進程名稱(可以自定義)
• – start: 腳本命令(對應 package.json 的 start 命令，如有修改需對應替換)

5.更改啟動端口(可選)

next.js 啟動端口默認為3000，如需更改啟動端口，有兩種方法。

第一種(靜態端口)

 "scripts": {"dev": "next dev","build": "next build","start": "next start -p 8888","lint": "next lint"}

第二種(動態端口)

 "scripts": {"dev": "next dev","build": "next build","start": "next start -p $PORT","lint": "next lint"}

pm2 start npm --watch --name next.js -- start PORT=8888

6.配置 nginx.conf 文件

server {listen       80;server_name  localhost;location / {proxy_pass http://127.0.0.1:3000/;}
}

7.效果圖

如果本篇文章對你有幫助的話，很高興能夠幫助上你。

當然，如果你覺得文章有什么讓你覺得不合理、或者有更簡單的實現方法又或者有理解不來的地方，希望你在看到之后能夠在評論里指出來，我會在看到之后盡快的回復你。