Linux(ubuntu 16.04 server)服务器部署Springboot+VUE前后端分离项目

一、安装nginx

sudo apt-get update              #更新apt源,更新之前可以把apt源更改为阿里云apt
sudo apt-get install nginx      #安装nginx

ps:

卸载nginx
rm -rf /etc/nginx/
rm -rf /usr/sbin/nginx
rm /usr/share/man/man1/nginx.1.gz
apt-get remove nginx*
dpkg --get-selections |grep nginx
apt-get --purge remove nginx-common

启动：

任意目录直接敲：nginx

注意：启动后可能会遇到80端口被占用的情况，则需要进行如下操作：

pkill -9 nginx            #强制停止Nginx
fuser -k 80/tcp           #把占用80/443的进程干掉
fuser -k 443/tcp


nginx -s reload   #修改配置后重新加载生效
nginx -s reopen   #重新打开日志文件
nginx -t -c /xxx/xxx/nginx.conf #测试nginx配置文件是否正确

二、将vue项目部署到nginx

1、进入到vue项目根目录下，执行如下命令打包（也可以直接用webstorm打包）：

npm run build

打包完成之后，会在项目根目录自动生成dist文件夹(里面有index.html文件和static文件夹)

2、在服务器根目录创建一个portal文件下，然后在文件夹下创建vue和springboot文件夹

cd /
mkdir portal
cd portal
mkdir vue
mkdir springboot

3、配置nginx

cd /etc/nginx/conf.d         #进入配置文件目录
touch vue.conf                  #创建vue.conf文件
sudo vim vue.conf            #打开并编辑vue.conf文件

将如下代码复制到vue.conf文件中：

server {
    listen       80;
    server_name  192.168.100.1; #(ip或者域名，浏览器访问路径)
    location / {
        root /portal/vue/dist; # 项目路径
        index index.html;
    }
    location /portal-rd{
        proxy_pass http://localhost:8081/portal-rd; # 后台代码的路径 对应vue.config.js里的target
    }
}

4、浏览器访问

nginx -t #查看配置文件是否正确
nginx -s reload # nginx重新加载配置文件
打开浏览器访问 ip(192.168.100.1)即可访问前端页面。

三、将springboot项目部署到服务器

1、进入到springboot项目根目录，在窗口地址栏输入powershell，执行如下命令将项目打包（也可以直接在IDEA下打包）：

mvn clean package -Dmaven.test.skip=true

2、打包完成之后target会出现一个jar包，将其拷贝到服务器的/portal/springboot下

3、编写启动脚本并运行项目

cd /portal/springboot
vim startboot.sh

输入如下内容并保存

#!/bin/sh
nohup java -jar portal-rd-0.0.1-SNAPSHOT.jar &

添加脚本可执行权限

chmod +x startboot.sh

启动springboot项目

./startboot.sh

查看运行日志：

tail -f  nohup.out