前后端分离项目部署在CentOS服务器，前端React+AntDesign，后端Springboot+Hibernate，编辑器IDEA。
一、前端项目的部署
1、准备工作
本地系统Window10，阿里云服务器系统CentOS7.3。
2、安装Nginx
1.安装nginx一些依赖包
[root@ABC~]# yum -y install gcc gcc-c++ openssl-devel pcre-devel httpd-tools
2.下载nginx-1.12.2
[root@ABC~]# wget http://nginx.org/download/nginx-1.12.2.tar.gz
3.解压二进制包(小编把nginx安装在了/usr/share文件夹，读者可以根据自己喜欢安装在喜欢的地方)
[root@ABC~]# tar -zxf nginx-1.12.2.tar.gz -C /usr/share
4.执行配置文件，指定需要的模块
[root@ABCnginx-1.12.2]# useradd nginx
[root@ABCnginx-1.12.2]# ./configure --prefix=/usr/share/nginx --user=nginx --group=nginx --with-http_ssl_module --with-http_mp4_module --with-http_flv_module
5.执行编译和安装
[root@ABCnginx-1.12.2]# make && make install
6.建立软链接
[root@ABCnginx-1.12.2]# ln -s /usr/share/nginx/sbin/nginx /usr/sbin
7.查看nginx端口占用情况
[root@ABC~]# netstat -anptu|grep nginx
8.查看nginx的版本
[root@ABC~]# nginx -V
3、测试Nginx
1.对nginx.conf进行配置（最简单的自定义配置）
server {
listen 80;//端口号,可以自己设置
server_name ip地址;//对应的网站域名
root /usr/share/nginx/root/app;//注意这是里放你上面 build文件夹里的内容
location / {
try_files $uri @fallback;
}
location @fallback {
rewrite .* /index.html break;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
2.启动nginx
[root@ABC~]# start nginx
如果部署成功，在浏览器界面输入ip地址:80，出现 Welcome to nginx！说明部署成功了。
4、IDEA编译前端项目
在IDEA对项目进行编译，输入npm run build指令，会得到一个dist的文件夹。
5、编译的前端项目部署在Nginx相应的位置
将编译的dist文件夹通过文件传输软件（Xftp6）拷贝到/usr/share/nginx/root文件夹下面（由于小编喜欢将项目文件命名为app，读者自行选择是否把dist文件夹名改名为app）
6、配置Nginx的nginx.conf文件
listen ：设置的端口号
server_name ：访问的名字
root ：你项目所放的地址
index index.html ：你的入口html文件
二、后端项目的部署
1、Springboot+Hibernate项目打包
1.修改pom.xml文件中的打包方式
<groupId>cn.chaconne</groupId>
<artifactId>项目名</artifactId>
<packaging>war</packaging>
<version>0.0.1-SNAPSHOT</version>
2.在pom.xml中添加依赖，并将scope状态改为provided
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
<scope>provided</scope>
</dependency>
3.修改项目的启动类
package cn.chaconne.xx;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.builder.SpringApplicationBuilder;
import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;
import org.springframework.web.WebApplicationInitializer;
@SpringBootApplication
public class XXApplication extends SpringBootServletInitializer implements WebApplicationInitializer {
@Override
protected SpringApplicationBuilder configure(SpringApplicationBuilder application) {
return application.sources(XXApplication.class);
}
public static void main(String[] args) {
SpringApplication.run(XXApplication.class, args);
}
}
4.通过Maven对项目进行编译打包。
在IDEA中，执行Lifecycle的Package指令，会在target文件夹出现xx-0.0.1-SNAPSHOT的文件夹。
2、在CentOS7部署tomcat，测试部署成功
1.去官网下载tomcat9的tar.gz安装包
2.通过文件传输软件Xftp移到CentOS7中并解压
[root@ABC~]# tar -xzvf tomcat9.tar.gz
3.对/etc 目录下的 profile 文件进行配置
[root@ABC etc]# vim profile
在文件的末尾添加如下代码
export CATALINA_HOME=/usr/local/tomcat/tomcat9
export PATH=${CATALINA_HOME}/bin
保持并退出：wq!
4.重启profile文件：
source /etc/profile
5.进入到/usr/local/tomcat/tomcat9/bin文件夹下,打开catalina.sh文件
vim catalina.sh
在# OS specific support. 前面加入如下代码：
JAVA_HOME=/usr/local/jdk/jdk1.8.0_91
JRE_HOME=$JAVA_HOME/jre
:wq! 保存并退出
6.启动tomcat服务：
[root@ABC bin]# ./startup.sh
在浏览器输入服务器IP地址，如果出现小猫咪，说明部署成功。
3、将编译后的war包部署到tomcat相应的websapp文件夹下
1.通过文件传输软件将编译的文件夹传输到tomcat的websapp文件夹下。
2.修改相应的server.xml配置文件,为了不用在URL上加项目名，按如下所示的进行配置。
<Host name="localhost" appBase="webapps"
unpackWARs="true" autoDeploy="true">
<!-- SingleSignOn valve, share authentication between web applications
Documentation at: /docs/config/valve.html -->
<Context docBase="/usr/local/tomcat/tomcat9/webapps/springboot" path="/" reloadable="true" crossContext="true"/>
<!--
<Valve className="org.apache.catalina.authenticator.SingleSignOn" />
-->
<!-- Access log processes all example.
Documentation at: /docs/config/valve.html
Note: The pattern used is equivalent to using pattern="common" -->
<Valve className="org.apache.catalina.valves.AccessLogValve" directory="logs"
prefix="localhost_access_log" suffix=".txt"
pattern="%h %l %u %t "%r" %s %b" />
</Host>
4、启动tomcat
进入到tomcat的bin文件夹下，执行./startup.sh启动tomcat！
前后端就部署好了，可以进行访问了！！！
