vue-element-template(github地址:https://github.com/PanJiaChen/vue-admin-template)是一個非常方便的后台前端基礎模板,近期個人獨立開發了一個vue-element-template+springboot的后台項目,部署到linux上遇到了一些坑花了大半天,故特此簡單紀錄一下。
更多關於vue-element-template的資料請訪問(https://panjiachen.github.io/vue-element-admin-site/zh/guide/#%E5%8A%9F%E8%83%BD)
1.部署springboot
首先在Linux上部署java環境:
(1)安裝jdk:yum install java-1.8.0-openjdk.x86_64
(2)配置環境:vi /etc/profile
文本末尾加上(JAVA_HOME為實際路徑,一般在/usr/lib/jvm下):
JAVA_HOME=/usr/lib/jvm/jre-1.8.0-openjdk.x86_64 PATH=$PATH:$JAVA_HOME/bin CLASSPATH=.:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar export JAVA_HOME CLASSPATH PATH
(3)使其生效:. /etc/profile
部署好java環境后,把配置好maven的springboot打包:mvn clean install -Dmaven.test.skip=true
打包好的jar包在target下,傳到服務器上執行:nohup java -jar XXXXX.jar,輸出在同一目錄的nohup.out中,注意服務器的java版本應與開發環境一致。
如果順利運行,訪問幾個測試接口沒有問題,那springboot就部署好了。
2.部署nginx+vue-element-template
先安裝部署nginx(安裝過程省略),安裝好的nginx路徑一般在/usr/local下
然后將vue-element-template打包:npm run build:prod
打好的包傳到服務器上,解壓,配置nginx/conf/nginx.conf(root為打包好的項目路徑)
進入sbin,執行:./nginx
在瀏覽器訪問服務器ip,如果能訪問到頁面就ok了。
有時候訪問不了,應先關閉防火牆:firewall-cmd --zone=public --add-port=80/tcp --permanent 並重啟 systemctl restart firewalld.service
3.配置api接口地址
在.env.production中配置
# just a flag ENV = 'production' # base api VUE_APP_BASE_API = '/prod-api'
在nginx/conf/nginx.conf下配置
重啟nginx: ./nginx -s reload
這樣的配置是將前端發送的接口請求(后綴為/prod-api)代理到8080端口,也就是我們的springboot的端口。
整個流程這樣就結束了,希望大家能一起交流,多多指導