（1）、打包若依SpringBoot后端

打開若依，點(diǎn)擊右側(cè)的Maven展開Maven管理，選擇ruoyi>Lifecycle 先雙擊clean清除原本啟動(dòng)項(xiàng)目時(shí)生成的文件。然后點(diǎn)擊package等待項(xiàng)目打包

打包完成后會(huì)在ruoyi-admin>src>target里面看到.jar后綴的文件，就代表打包成功（可以把這個(gè)文件復(fù)制出來存放到其他地方，方便后面啟動(dòng)）

（2）、部署若依SpringBoot后端

把剛剛打包好的文件存放到自己的文件位置

然后在路徑欄里輸入cmd，回車會(huì)打開一個(gè)命令框

在命令框里輸入java -jar ruoyi-admin.jar回車啟動(dòng)打包好的jar包。

這個(gè)窗口不要關(guān)閉?。。?！關(guān)閉就是結(jié)束運(yùn)行了

（3）、打包若依Vue前端

使用Visual Studio Code打開ruoyi-ui文件夾

打開終端：左上角任務(wù)欄選擇終端>新建終端

在新建終端中輸入命令npm run build:prod，回車等待打包完成

打包完成后查看文件目錄，有一個(gè)叫dist的文件夾就是打包成功了，dist的文件夾介紹打包的Vue項(xiàng)目了

（4）、部署若依Vue前端

前端部署需要使用nginx 下載地址（https://nginx.org/en/download.html）下載

下載完成解壓到任意地方

然后進(jìn)入nginx-1.22.1>html  把剛剛打包好的Vue前端dist文件復(fù)制進(jìn)來

然后返回上一層 進(jìn)入conf文件夾

用Visual Studio Code打開nginx.conf

更改以下代碼（改完ctrl+s保存就可以關(guān)閉Visual Studio Code）

        location / {
            root   html/dist;  // 打包好的文件路徑
            try_files $uri $uri/ /index.html; # 將所有路由請求重定向到index.html
        }
 
        location /prod-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://localhost:8080/;       #后臺項(xiàng)目的運(yùn)行端口
        }

啟動(dòng)ngxin 首先回到nginx-1.22.1文件夾里

在路徑欄里輸入cmd，回車會(huì)打開一個(gè)命令框

在命令行里輸入start nginx 回車會(huì)出現(xiàn)閃一下，就代表啟動(dòng)了

然后在瀏覽器地址欄中輸入http://localhost/ 回車 出現(xiàn)若依的登錄頁面就代表全部部署完成 （如果打開的時(shí)候提示系統(tǒng)接口502異常原因結(jié)束后端的命令窗口關(guān)閉了）

停止運(yùn)行的話在命令行輸入nginx -s stop回車（前端），后端的直接關(guān)閉命令窗口就可以了

總結(jié)

到此這篇關(guān)于打包部署若依(RuoYi)SpringBoot后端和Vue前端的文章就介紹到這了,更多相關(guān)打包部署若依SpringBoot和Vue內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論