如何把vuejs打包出來的文件整合到springboot里
這個需求不知道是不是合適，因為靜態(tài)的vuejs項目，用nginx部署，聽說很快。
一般有這個需求的，都是用tomcat來部署java項目，tomcat轉(zhuǎn)發(fā)靜態(tài)vuejs，應(yīng)該不會很快。
好吧，以上都是聽說。。。應(yīng)該。。。實際嘛？。。。
廢話不多講，馬上搞起。
這里第一句要說的是，目前這個方式我認為只支持#這個方式的路由，如果改成了html5的mode: 'history'，應(yīng)該是不支持的。
開始準備：
注意，我的springboot用的視圖模板是thymeleaf，靜態(tài)文件夾路徑默認是resources/static/，我們目的就是要把dist這個打包好的文件夾，整個放進去這里。
1.修改vuejs的config/index.js,在里面找到assetsPublicPath，改為/dist/,記住，是build:{}這里的，不是上面dev:{}的。
2.執(zhí)行npm run build，會出現(xiàn)一個dist文件夾在vuejs項目目錄里。
3.把這個dist文件夾copy到springboot的resources/static/,記住，是整個dist連文件夾一起copy過來。
OK，搞掂。就是這么簡單。
訪問localhost/dist/index.html/#/就可以
PS:本人對webpack不熟悉，按理，只要修改上圖中的assetsRoot，可以直接build到最終路徑，不用手動copy那么麻煩
總結(jié)
以上所述是小編給大家介紹的如何把vuejs打包出來的文件整合到springboot里，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要為大家詳細介紹了vue中封裝組件的相關(guān)知識,文中的示例代碼講解詳細,對我們深入了解vue有一定的幫助,感興趣的小伙伴可以跟隨小編一起學習一下2023-10-10
這篇文章主要介紹了vue,uniapp--js禁止頁面滾動,取消滾動方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-05-05
這篇文章主要介紹了vue 動態(tài)組件用法,結(jié)合實例形式總結(jié)分析了vue 動態(tài)組件基本功能、原理、使用方法及操作注意事項,需要的朋友可以參考下2020-03-03
本篇文章主要介紹了Vue-Router模式和鉤子的用法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-02-02
VUE項目實現(xiàn)全屏顯示功能之screenfull用法
這篇文章主要介紹了VUE項目實現(xiàn)全屏顯示功能之screenfull用法,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-01-01
ant design Vue 純前端實現(xiàn)分頁問題
這篇文章主要介紹了ant design Vue 純前端實現(xiàn)分頁問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
vue+vue-fullpage實現(xiàn)整屏滾動頁面的示例代碼(直播平臺源碼)
這篇文章主要介紹了vue+vue-fullpage實現(xiàn)整屏滾動頁面,本文通過示例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-06-06
淺談vue中computed屬性對data屬性賦值為undefined的原因
本文主要介紹了淺談vue中computed屬性對data屬性賦值為undefined的原因，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
這篇文章主要介紹了Vue中封裝input組件的實例詳解的相關(guān)資料,希望通過本文能幫助到大家，需要的朋友可以參考下2017-10-10
本篇文章主要介紹了淺談vue.js中v-for循環(huán)渲染，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-07-07