NextJS工程部署到阿里云linux Ecs

nextjs项目有多种部署方式，本文介绍最简单的一种方式，将源码上传到云服务器，编译后使用pm2后台运行nextjs工程。

检查node、npm是否安装

查看npm版本，如果版本较低先升级npm版本

npm -v

卸载

yum remove nodejs npm -y

安装新版本

sudo yum install https://rpm.nodesource.com/pub_21.x/nodistro/repo/nodesource-release-nodistro-1.noarch.rpm -y 
sudo yum install nodejs -y --setopt=nodesource-nodejs.module_hotfixes=1

部署和编译

1. 拷贝工程源码目录到服务器，其中node_modules、.git不需要上传

2. 编译

npm run build

使用pm2后台运行nextjs程序

1. 安装pm2

npm install -g pm2

2. 运行

#注意当前是在工程目录下，命令中的名称可以任意命名，pm2管理中起到标识作用，实际运行的程序是当前目录下
pm2 start --name 自定义名称 npm -- start

3. 查看端口占用，如工程中使用的3000，端口列表中也出现了，说明后台运行成功了

netstat -nultp

4. 如果服务器开放了对应端口，可以加端口浏览器访问项目，如果只能开放80，继续nginx

安装配置nginx

1. 安装nginx

yum install nginx -y

2. nginx配置文件(/etc/nginx/etc/nginx.conf)

# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;events {worker_connections 1024;
}http {log_format  main  '$remote_addr - $remote_user [$time_local] "$request" ''$status $body_bytes_sent "$http_referer" ''"$http_user_agent" "$http_x_forwarded_for"';access_log  /var/log/nginx/access.log  main;sendfile            on;tcp_nopush          on;tcp_nodelay         on;keepalive_timeout   65;types_hash_max_size 2048;autoindex on;autoindex_exact_size off;autoindex_localtime on;include             /etc/nginx/mime.types;default_type        application/octet-stream;# Load modular configuration files from the /etc/nginx/conf.d directory.# See http://nginx.org/en/docs/ngx_core_module.html#include# for more information.include /etc/nginx/conf.d/*.conf;server {listen       80 default_server;listen       [::]:80 default_server;server_name  _;root         /usr/share/nginx/html;# Load configuration files for the default server block.include /etc/nginx/default.d/*.conf;location / {}error_page 404 /404.html;location = /40x.html {}error_page 500 502 503 504 /50x.html;location = /50x.html {}}include /etc/nginx/vhosts/*.conf;
}

3. 多工程配置
   创建 /etc/nginx/vhosts/工程名.conf，自行修改域名，确保域名映射已设置好

server {listen       80;#443;server_name  xxx.xxxx.com;root html;index index.html index.htm;location / {proxy_pass http://127.0.0.1:3000;#设置主机头和客户端真实地址，以便服务器获取客户端真实IPproxy_set_header Host $host;proxy_set_header X-Real-Ip $remote_addr;proxy_set_header X-Forwarded-For $remote_addr;}
}

4. 启动nginx

# 启动
systemctl start nginx
# 停止
systemctl stop nginx
# 重启
systemctl restart nginx 
# 重新加载配置文件
nginx -s reload

5. 使用域名访问测试

pm2命令介绍

# 查看任务
pm2 list/# 重启
pm2 restart app_name# 停止
pm2 stop app_name|app_id# 停止所有
pm2 stop all# 删除
pm2 delete app_name|app_id# 删除所有
pm2 delete all# 日志
pm2 logs app_name|app_id# 查看所有日志
pm2 logs