vue前端代碼如何通過maven打成jar包運行
更新時間：2024年01月02日 09:42:52 作者：洋哥登陸
這篇文章主要介紹了vue前端代碼如何通過maven打成jar包運行問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
vue前端代碼生成jar包執(zhí)行
業(yè)務(wù)開發(fā)需求，需要將vue前端代碼通過jar包啟動。
當前項目是springcloud微服務(wù)模式，創(chuàng)建了一個新的module做得。
個人認為springboot下也可以操作。
結(jié)果：打成的jar包內(nèi)包含vue前端代碼，通過java -jar命令直接啟動，即可訪問前端頁面。
1.新建module項目
項目工程結(jié)構(gòu)如下：
一定要配置WebApplication作為入口類，前端dist包打成jar包后是沒有啟動入口類的，所以一定要有啟動類。
2.pom.xml
// 有web就可以了
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
</dependencies>
// 個人使用的maven打包插件
<build>
<finalName>zsddweb</finalName>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<executions>
<execution>
<goals>
<goal>repackage</goal>
</goals>
</execution>
</executions>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-surefire-plugin</artifactId>
<configuration>
<skipTests>true</skipTests>
</configuration>
</plugin>
</plugins>
</build>
3.application.yml文件
server: port: 8005 spring: application: name: zsddweb
4.vue生成的dist包
?。ue的生產(chǎn)環(huán)境一定要配置自己本地的ip和后端的服務(wù)端口
vue正常打dist包即可。
5.生成jar包
將vue項目打包后的dist文件夾中的放到resource的static中
將web直接install打包，生成的jar包通過 java -jar ** 啟動
6.訪問index.html
localhost:配置的端口/index.html
總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要為大家介紹了vue3封裝一個帶動畫的關(guān)閉按鈕示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-09-09
vue3 拖拽hooks(可兼容移動端)和自定義指令拖拽的實現(xiàn)代碼
這篇文章主要介紹了vue3 拖拽hooks(可兼容移動端)和自定義指令拖拽的實現(xiàn)代碼,本文通過實例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考借鑒價值,需要的朋友參考下吧2024-01-01
vue數(shù)據(jù)push后不能響應(yīng)式更新的問題
這篇文章主要介紹了vue數(shù)據(jù)push后不能響應(yīng)式更新的問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
vue中input標簽上傳本地文件或圖片后獲取完整路徑的解決方法
本文給大家介紹vue中input標簽上傳本地文件或圖片后獲取完整路徑，如E:\medicineOfCH\stageImage\xxx.jpg，本文給大家分享完美解決方案，感興趣的朋友跟隨小編一起看看吧2023-04-04
Vue+element 解決瀏覽器自動填充記住的賬號密碼問題
我們在做form表單的時候,會發(fā)現(xiàn),瀏覽器會自動的將我們之前保存的密碼,自動的填充到表單中input 為 type="password" 的框中，如何實現(xiàn)此功能呢，下面小編給大家介紹下，感興趣的朋友一起看看吧2019-06-06
這篇文章主要介紹了vue3+vite使用jsx和tsx詳情，文章通過安裝@vitejs/plugin-vue-jsx展開詳細的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-05-05
防抖節(jié)流是可以說是一種優(yōu)化組件性能的技巧,可以有效減少組件中的渲染次數(shù)和計算量,本文主要介紹了Vue3項目中使用防抖節(jié)流的實現(xiàn)示例,感興趣的可以了解一下2024-04-04
在vue中使用el-tab-pane v-show/v-if無效的解決
這篇文章主要介紹了在vue中使用el-tab-pane v-show/v-if無效的解決，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
vue項目中常見的三種文件類型在線預(yù)覽實現(xiàn)(pdf/word/excel表格)
最近在項目中要做一個pdf在線預(yù)覽的功能,索性給大家整理個全面的,這篇文章主要給大家介紹了關(guān)于vue項目中常見的三種文件類型在線預(yù)覽實現(xiàn)的相關(guān)資料,文件類型分別是pdf/word文件/excel表格,需要的朋友可以參考下2022-05-05
在本篇文章里小編給大家整理的是關(guān)于VUE 項目初建和常見問題以及相關(guān)知識點內(nèi)容，有需要的朋友們學(xué)習(xí)下。2019-09-09