Nuxt服务端部署（CentOS7+nginx+pm2)

简介

• Nuxt：对标Next的一款适用于Vue的服务端渲染（SSR）应用框架
• pm2: Node进程守护，方便当服务挂掉时重启以及生成日志
• Nginx: 一个轻量级的HTTP服务框架（大部分服务都在用）

一、环境准备

部署Nuxt用到最少的环境依赖包括：node，pm2，所以这里先依次安装

CentOS下安装Node.js

# 1、获取资源
cd /usr/local/src
wget  https://npm.taobao.org/mirrors/node/v10.13.0/node-v10.13.0.tar.gz
# 2、解压
tar xvf node-v10.13.0.tar.gz
# 3、进入解压后node文件夹开始编译
cd node-v10.13.0/
./configure
make

# 4、安装Node
make install
# 5、验证是否正确安装
node -v

注意：

• 第3步编译过程中若报错：C++ Compiler too old, need g++ 4.9.4 or clang++ 3.4.2 (CXX=g++)，那需要先升级一下 gcc，编译正常的话请忽略直接跳至第五步开始安装,通过gcc -v查看版本

pm2安装

• 关于pm2的教程可以参考：PM2实用入门指南

npm install pm2 -g

二、Nuxt打包上传

1. 在本地开发的项目中配置及打包 【推荐工具：winSCP】

npm run build

2. 打包后，将以下文件上传至服务器

.nuxt
static
nuxt.config.js
package.json

3. 在服务器上安装相应依赖

# 假设nuxt打包的内容放在 名为 nuxtSSR文件夹下
cd nuxtSSR
npm install

三、Nginx配置代理服务

# 新建一个nuxtserver服务
upstream nuxtserver{
        server 127.0.0.1:3000;
        keepalive 64;
 }
 server {
 		listen	8080;
 		server_name		www.mysite.come;  #这里对应你服务器的域名
 		location / {
				proxy_pass		http://nuxtserver;  #这里对应上面upstream中新建的服务名
				index		index.html	index.htm;
		}
 }

• 保存配置：nginx -s quit
• 重启Nginx: nginx

四、pm2启动nuxt项目服务

进到对应项目（这里是nuxtSSR)目录下

pm2 start npm --name "nuxtSSR" -- run start

• 注意：这里的name对应的是package.json中的项目名称
• 查看进程：pm2 list

五、最后访问

在上面nginx的配置中，代理了8080端口的访问，所以这里通过http://mysite.com:8080来进行访问。