SpringBoot+Vue项目打包部署

• 演示项目是SpringBoot+VUE前后端分离的。需要分别部署前端、后端项目，做集群的话需要将后端项目部署到多台服务器中。

使用的技术及服务器：
– Linux系统：Centos7
– 前端：VUE+Nginx
– 后端：SpringBoot+JDK1.8+Redis+Tomcat+MySQL+Maven

部署前的准备工作

0.安装环境及相关软件工具
1.MySQL中创建数据库、数据表、导入初始数据
2.修改项目的数据库相关配置（url，username，password等）
3.修改Redis相关配置（host，port，password等）
4.日志相关配置（日志路径、输出字符集UTF-8等）

前端部署

• 1.将项目源码打包为zip格式（有隐藏文件，不打包可能不完整），上传到对应的服务器中指定目录下。

#解压文件
unzip XXX.zip

• 2.打包项目

  • 进入解压后的目录

  cd XXX/
  

  • 安装依赖

  #使用淘宝的镜像源
  npm install --unsafe-perm --registry=https://registry.npm.taobao.org  
  

  • 打包

  npm run build:prod
  

• 3.打包完成后，会在当前目录下生成/dist目录

• 4.配置nginx

  • 到安装的Nginx目录下

  cd /usr/local/nginx/conf
  

  • 修改nginx.conf文件

  #第一处改动
  #user  nobody
  修改为
  user  root # 防止权限问题，生产上可以根据实际用户设置
  
  #第二处改动
      server {
          listen      80;
          server_name localhost;
  
          location / {
              root  /**/**/***/****/dist;#修改此处目录为打包后的/dist
              index index.html index.htm;
          }
          
          #第三处改动
          # /***api/ 表示的是转发路径
          location /***api/ {
              proxy_set_header Host $http_host;
              proxy_set_header X-Real-IP $remote_addr;
              proxy_set_header REMOTE-HOST $remote_addr;
              proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
              proxy_pass http://ip:port/; #此处为实际的后端IP和Port
          }
      }
  

  • 如果是集群配置，则除了上面的第一处、第二处改动外，第三处如下改动

  #第一处改动
  #user  nobody
  修改为
  user  root # 防止权限问题，生产上可以根据实际用户设置
  
  # 第三处 第一部分改动
  # 配置集群
  

  • 重新加载配置

  /usr/local/nginx/sbin/nginx  -s reload
  

• 5.到nginx目录下启动nginx即可

cd /usr/local/nginx/sbin/
./nginx

后端部署

• 1.将项目源码打包为zip格式（有隐藏文件，不打包可能不完整），上传到对应的服务器中指定目录下。

#解压文件
unzip XXX.zip

• 两种打包方式：

  • 1.打包项目（jar包）

    • 进入解压后的目录

    cd XXX/
    

    • 打包

    mvn package
    

    • 打包完成后，在当前目录下生成target目录，进入该目录就可以看到打包完成的jar包
    • 备份打包完成的jar包到上一级目录

    cp ./xxx.jar  ../xxx.jar
    

    • 执行jar包启动项目

    nohup java -jar xxx.jar &
    

  • 2.打包项目（war包）

    • 在项目中修改pom.xml

    
    war
    
        org.springframeword.boot
        spring-boot-starter-web
        provided
    
    

    • 在项目启动类的同级目录下添加一个启动类

    import org.springframework.boot.builder.SpringApplicationBuilder;
    import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;
    
    public class SpringBootStartApplication extends SpringBootServletInitializer {
        @Override
        protected SpringApplicationBuilder configure(SpringApplicationBuilder builder) {
            //指向原来的启动类XXX.class
            return builder.sources(XXX.class);
        }
    }
    
    

    • 将修改后的文件上传到服务器项目下对应的目录中替换原来文件。
    • 到项目的目录下
      • 执行清理（处理之前打jar包生成的文件）

      mvn clean
      

    • 打包

    mvn package
    

    • 打包完成后，在当前目录下生成target目录，进入该目录就可以看到打包完成的war包
    • 备份打包完成的war包到上一级目录

    cp ./xxx.jar  ../xxx.war
    

    • 将war包放置在tomcat的webapps目录下

    cp ..../xxx.war ./
    

    • 修改tomcat的配置文件server.xml,使tomcat根目录指向当前部署的项目而不是tomcat主页

            
                #添加下面配置，使得访问根目录时直接访问项目而不是tomcat首页
                
    

    • 启动tomcat

    service tomcat start