前后端分离（Spring Boot 整合VUE）打包部署服务器

前后端分离（Spring Boot 整合VUE）打包部署服务器

一. 打包Vue项目

1. build目录下的utils.js添加 publicPath: ‘…/…/’（否则打包后项目图标可能显示不出来）

2.config目录下index.js里assetsPublicPath: ‘/’ 变成assetsPublicPath: ‘./’（否则打包后会出现js文件路径找不到）

3.终端运行npm run build，生成dist文件夹

二.部署前端到nginx

1.将打包后的dist文件中的static文件夹和index.html文件复制到nginx的html文件夹中

2.配置nginx.conf文件

原文件中server的配置

#location / {
#    root   html;
#    index  index.html index.htm;
#}

location / {
     try_files $uri $uri/ /index.html;
}

将其改为

server {
        listen       8800; 
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        #location / {
        #    root   html;
        #   index  index.html index.htm;
        #}
		location / {
			try_files $uri $uri/ /index.html;
		}

3.保存后运行nginx，即可在不运行vue项目时访问到页面

三.后端项目打包

1.首先打开后端项目的 pom.xml，修改 标签里的 war 为 jar ，除此之外，还可以配置版本号、jar 包名称等。

2.使用maven进行打包，点击idea右侧maven的package或运行mvn clean package命令

3.等待打包完成后，在项目的 target 文件夹下就会出现我们的 jar 包