nginx部署前后端分离项目

本人皮毛，简述前后端项目通过nginx进行部署
前后端分离项目
前端：web项目，vue开发，调用后端接口
后端：java项目，共计6个后台系统，通过nginx进行转发

前端部分

使用vscode进行前端项目开发，主要说明打包部分
输入指令：npm run dev （运行本地项目）
输入指令：npm run build:prod （将项目以正式环境配置进行打包）

打包成功后的项目：在你的项目文件位置会有dist的文件夹，这个就是打包成功后生成的文件夹，后续介绍，需重命名此文件夹，使用nginx启动部署。

后端部分

后端就是将项目打包成war，打包自行处理，不做介绍
分别将多个不同后台项目多个tomcat分开运行，前端项目需要的api分别从不同的后台系统获取，多个tomcat运行端口访问不一致 ，使用nginx进行转发

Nginx部分

去nginx官网进行下载，不做介绍，windows环境下nginx，直接点击运行nginx.exe运行即可。
linux环境启动：./usr/local/nginx/sbin/nginx
重启：./usr/local/nginx/sbin/nginx -s reload
停止：./usr/local/nginx/sbin/nginx -s stop
ps -ef | grep nginx 找到进程
kill掉进程ID也可以：kill -9 IP
更多关于nginx的安装部署等基本信息，自行搜索

重点：配置 nginx.conf 部分，在nginx\nginx-1.20.1\conf的文件夹下
更详细可查询nginx的各参数介绍

主要部分：

server {
    listen       9000;
	server_name  localhost;
	access_log  logs/access.log  main;
	error_log  logs/error.log;

	absolute_redirect off;
	
	location  /gzdc-web{
		root D:/bak;
		index index.html;
		try_files       $uri $uri/ /gzdc-web/index.html;
    }
	
	location /gzydzf2-center{
        proxy_pass   http://127.0.0.1:8020/gzydzf2-center;
	}
	
	location /gzdc-portal{
        proxy_pass   http://127.0.0.1:8031/gzdc-portal;
	}
	
	location /gzxzcf{
        proxy_pass   http://127.0.0.1:8022/gzxzcf;
	}
	
	location /gzdc{
        proxy_pass   http://127.0.0.1:8023/gzdc;
	}
	
}

布置完成，进入nginx的sbin文件夹，双击运行nginx.exe即可
访问项目入口即可：http://ip:9000/项目名称/
9000为nginx配置的监听端口