前后端分离项目单机部署

一、打包前端代码

vue项目通过命令 npm run build 打包，打包后的文件保存在dist目录下：

二、后端打包

在idea右侧找到maven按钮，进入启动类所在模块-生命周期，先双击clean按钮，清理旧数据；再双击install按钮进行打包，打包完成后默认存在target目录下。

三、项目部署

创建文件夹用来存放前后端打包文件，把前端dist文件和后端jar包进行上传。

服务器内要安装与开发版本一致的jdk，和nginx(部署前端代码)。

安装jdk：可上官网下载二进制文件，上传到服务器后解压，配置。

安装nginx ：通过命令yum install nginx 下载，下载位置默认在/etc/nginx目录下。

之后编辑nginx.conf文件配置nginx：

固定模版，单机项目可直接拿来使用，只需第一次安装时配置

只需关注server.listen 可修改端口号，默认80；server.root 前端打包后文件夹的存放路径

ini 复制代码

# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/

user root;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024;
}

http {
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile            on;
    tcp_nopush          on;
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 4096;

    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;

    # Load modular configuration files from the /etc/nginx/conf.d directory.
    # See http://nginx.org/en/docs/ngx_core_module.html#include
    # for more information.
    include /etc/nginx/conf.d/*.conf;

    server {
        listen       80;
        listen       [::]:80;
        server_name  _;
        root         /juncai/dist;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

location /api {
        proxy_pass http://localhost:8888; 
        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;
        rewrite ^/api/(.*)$ /$1 break;
    }

        error_page 404 /404.html;
        location = /404.html {
        }

        error_page 500 502 503 504 /50x.html;
        location = /50x.html {
        }
    }

最后重启nginx服务：service nginx restart，

启动jar包：nohup java -jar employee_server.jar & ，即可完成部署。启动后日志信息会保存在nohup.out文件中，可查看报错信息等。

后续代码修改重新部署时：

后端：通过 ps -ef | grep java 命令查看java相关进程

通过kill -9 17398 终止当前后端进程，再将旧的jar删除，把新的jar包上传后重新，启动jar包：nohup java -jar employee_server.jar &，最后通过noput.out文件查看启动进度。

前端：

把整个旧dist文件夹删除，再把新打包的dist文件上传到服务器同一个路径下，最后重启nginx服务 service nginx restart 即可完成部署。