egg.js+vue.js 云服务器部署 -- 项目部署

上一章把云服务器的环境都配置好了，现在开始我们的项目部署；

egg.js+vue.js 云服务器部署 -- 环境配置

一、后台服务部署；

1、首先我们先把项目从git 上 clone下来；不在git的也可以通过Xftp 上传至服务器，接下来就是熟悉的味道,

cnpm install安装依赖包；

2、我的项目是用 egg-sequelize 构建的数据库，所以我这里直接使用命令生成对应的数据库和表；（注：我的后台项目已经构建好了生成数据库和表的配置）

# 升级数据库 npx sequelize db:migrate 

其他同学可以自行建库建表；

3、接着便是启动egg服务；

npm run start

框架内置了egg-cluster来启动Master 进程，Master 有足够的稳定性，不再需要使用pm2等进程守护模块。

默认开启了7001端口，接着便可通过ip:7001访问接口，查看接口是否正常；

如有报错，可到/root/logs目录查看日志并排查

详见官网；

后端部署就完成了！

二、前端页面部署；

由于我是用了前后端分离，前端用vue3.0+ts 写的，打包压缩后的目录就用nginx启动服务，反向代理；本人对nginx亦是一窍不通，整理众大神文档资料后也算跑起来了，合不合理就不知道了；

1、nginx启动之后默认是代理80端口，所以访问ip可以看到；（上一章已配置完毕）

2、接下来就是新启动一个端口，代理前端页面；我选择8080；

cd /usr/local/nginx/conf

vim nginx.conf

3、依葫芦画瓢添加配置

nginx可以有多个server，那么就再简单添加一个server；并在阿里云安全组添加8080端口；

server {

    listen 8080; server_name localhost:8080;   #监听8080端口

    location / {

        root /usr/local/src/web;  #前端项目目录

        index index.html;

    } #代理前端静态页面

    location /api/ {

        proxy_pass http://127.0.0.1:7001/; #//转发接口 (/api/的请求会转发至http://127.0.0.1:7001/)

        proxy_set_header Host $host:$server_port;

    }

    error_page 500 502 503 504 /50x.html;

    location = /50x.html { root html; }

}

4、将vue打包后放入 /usr/local/src/web

项目部署完毕，此时便可以通过8080端口访问我自己的网页了，也可以通过编辑并存储数据；美滋滋！