第一步:打包并拷贝至服务器
在本地项目的文件夹下执行 npm run build
进行打包,打包完成后将以下三个文件/文件夹拷贝至服务器,任意位置即可,比如 home/nuxtapp
。
.nuxt
package.json
/static
第二步:安装依赖
和 SPA 不同,Nuxt 应用打包后也需要安装依赖。
进入刚才的文件夹 home/nuxtapp
,执行 npm i
命令安装依赖。如果服务器没有安装过 node,输入下面这个命令安装(CentOS)。
dnf module install nodejs:16
其中 16 是版本号
node 安装好后自带 npm,直接执行 npm i
即可。
npm i
第三步:运行服务
启动服务可以选择直接执行:
npm run start
但是这样可能存在服务挂掉的情况,一旦挂掉只能手动重启。所以推荐使用 pm2 进行启动,pm2 是一个进程守护管理器,可以管理和保持应用一直在线。
首先安装 pm2。
npm install pm2 -g
然后进入项目所在的文件夹,执行下面这个命令使用 pm2 启动服务。
pm2 start npm --name "your app name" -- run start
第四步:使用 nginx 代理
启动后的服务,默认运行在 localhost:3000
,但这样外网是访问不到的,所以需要使用 nginx 进行代理。
如果没有安装 nginx,输入下面这个命令安装(CentOS)。
yum install nginx
安装后,找到 nginx.conf 所在的文件夹,并打开,添加以下监听。
server {
listen 8000;
server_name localhost;
location / {
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_set_header Host $host;
proxy_set_header X-Nginx-Proxy true;
proxy_cache_bypass $http_upgrade;
proxy_pass http://localhost:3000/;
}
}
其中 8000 是端口号,可以任意输,80 也可以,9000 也可以,但记得在你的服务器防火墙上启用这个端口,不然是拒绝访问的。
修改之后保存,之后重启 nginx 服务即可(CentOS)。
systemctl restart nginx
重启后,访问 IP:8000
即可看到你的页面。将 IP
替换为你的服务器地址。