由于为了达到更好的SEO效果，最近研究了下nuxt.js 来做服务端渲染（SSR）。
本文来讲讲，在本地开发完成后怎么在服务器上配合nginx部署node项目。
技术栈：
- nuxt.js -- 2.9.2
- nginx -- 1.10.3
- pm2 -- 3.5.1
- node -- v10.16.3
- npm -- 6.9.0
步骤：
- 本地打包、上传到服务器
- 安装服务器环境
- 安装项目依赖和测试启动
- PM2 守护启动
- nginx配置
正文：
本地打包
打包前，先设置好在服务器中要打开的端口
设置在 package.json中:(我设置的8004端口)
[外链图片转存失败(img-GrI7KyQh-1569229030947)(nuxtjs项目部署Ubuntu服务器\Image.png)] 在项目终端执行：
npm run build上传服务器
本地打包完成后，上传文件到服务器。
只需要把下图中所示的四个文件(夹) 上传到服务器即可。
[外链图片转存失败(img-YV2IyULH-1569229030948)(nuxtjs项目部署Ubuntu服务器\Image1.png)]
怎么上传文件到服务器本文不再做说明。
安装服务器环境
- 安装node
- 安装npm
- 安装 PM2
- 安装 nginx
这些安装 网上一搜一堆，本文不再做说明。
安装项目依赖
cd 切换到项目文件夹内，执行npm install 安装项目依赖环境
npm install测试启动
当安装完依赖后，npm start 就可以看到 nuxt 运行起来了。
npm start这时就已内网 IP+设置的端口（8004）启动了
pm2 守护开启进程
在项目的根目录下，执行一下命令。启动nuxt项目
pm2 start npm --name "my-nuxt" -- run start可以用 pm2 list 看到当前所有node进程列表。
关于pm2的使用，请访问：https://juejin.im/post/5be406705188256dbb5176f9
顺利的话，nuxt项目已经启动起来了，但是只能内网IP进行访问。
此时，可以使用nginx做反向代理 通过外网来访问nuxt项目
nginx配置
切换到nginx目录，并打开nginx配置项。
cd /etc/nginx
vim nginx.conf配置nginx:
server{
listen 80/port;
server_name your_domain;
gzip on;
gzip_types text/plain application/xml text/css application/javascript;
gzip_min_length 1000;
location / {
expires $expires;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_read_timeout 1m;
proxy_connect_timeout 1m;
proxy_pass http://127.0.0.1:8004;
# http://127.0.0.1 + nuxt启动端口
}
}重启nginx
nginx -s reload