如何把vuejs打包出來的文件整合到springboot里
這個需求不知道是不是合適，因為靜態(tài)的vuejs項目，用nginx部署，聽說很快。
一般有這個需求的，都是用tomcat來部署java項目，tomcat轉發(fā)靜態(tài)vuejs，應該不會很快。
好吧，以上都是聽說。。。應該。。。實際嘛？。。。
廢話不多講，馬上搞起。
這里第一句要說的是，目前這個方式我認為只支持#這個方式的路由，如果改成了html5的mode: 'history'，應該是不支持的。
開始準備：
注意，我的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那么麻煩
總結
以上所述是小編給大家介紹的如何把vuejs打包出來的文件整合到springboot里，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關文章
Vue零基礎入門之模板語法與數(shù)據(jù)綁定及Object.defineProperty方法詳解
這篇文章主要介紹了Vue初學基礎中的模板語法、數(shù)據(jù)綁定、Object.defineProperty方法等基礎，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-09-09
vue?element表格某一列內容過多,超出省略號顯示的實現(xiàn)
這篇文章主要介紹了vue?element表格某一列內容過多,超出省略號顯示的實現(xiàn)方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-01-01
這篇文章主要介紹了vue項目中如何配置eslint和prettier問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
vue列表數(shù)據(jù)刪除后主動刷新頁面及刷新方法詳解
這篇文章主要給大家介紹了關于vue列表數(shù)據(jù)刪除后主動刷新頁面及刷新方法的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2021-05-05
使用proxytable 配置解決 vue-cli 的跨域請求問題【推薦】
這篇文章主要介紹了利用 proxytable 配置解決 vue-cli 的跨域請求問題,本文的目錄結構基于 webpack 模板結構，需要的朋友可以參考下2018-05-05
詳解Vue2.X的路由管理記錄之 鉤子函數(shù)（切割流水線）
本篇文章主要介紹了Vue2.X的路由管理記錄之 鉤子函數(shù)（切割流水線），具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-05-05
vue 3 中watch 和watchEffect 的新用法
本篇文章主要通過 Options API 和 Composition API 對比 watch 的使用方法，讓大家快速掌握 vue3 中 watch 新用法,需要的朋友可以參考一下哦，希望對大家有所幫助2021-11-11
Vue+jsPlumb實現(xiàn)連線效果(支持滑動連線和點擊連線)
jsPlumb 是一個比較強大的繪圖組件，它提供了一種方法，主要用于連接網(wǎng)頁上的元素。本文將利用jsPlumb實現(xiàn)連線效果，同時支持滑動連線和點擊連線，感興趣的可以了解一下2023-01-01
如何使用VuePress搭建一個類型element ui文檔
這篇文章主要介紹了如何使用VuePress搭建一個類型element ui文檔，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-02-02
Vue公共loading升級版解決思路(處理并發(fā)異步差時響應)
這篇文章主要介紹了Vue公共loading升級版（處理并發(fā)異步差時響應）,解決思路是通過定義一個全局對象來存儲每個接口的響應狀態(tài)，直到每個請求接口都收到響應才變更狀態(tài)，結束loading動畫，需要的朋友可以參考下2023-11-11