vue3整合springboot打完整jar包
更新時間：2023年09月11日 15:18:24 作者：華山令狐蟲
本文主要介紹了vue3整合springboot打完整jar包,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
前端
- .env.developmen
VITE_APP_BASE_URL='/api'
- .env.production
VITE_APP_BASE_URL='/'
axios 配置
axios.defaults.baseURL = import.meta.env.VITE_APP_BASE_URL
package.json
"scripts": {
"dev": "vite --mode development",
"build": "vite build --mode production"
}vite.config.js
server: {
port: 4000, //設(shè)置服務(wù)啟動端口號，是一個可選項(xiàng)，不要設(shè)置為本機(jī)的端口號，可能會發(fā)生沖突
open: true, //是否自動打開瀏覽器，可選項(xiàng)
cors: true, //允許跨域。
// 設(shè)置代理
proxy: {
'/api': {
target: 'http://localhost:8053/', //這是你要跨域請求的地址前綴
changeOrigin: true, //開啟跨域
rewrite: (path) => path.replace(/^\/api/, '')
}
}
}后端
pom.xml
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>exec-maven-plugin</artifactId>
<version>1.6.0</version>
<executions>
<execution>
<id>exec-pnpm-install</id>
<phase>validate</phase>
<goals>
<goal>exec</goal>
</goals>
<configuration>
<executable>pnpm</executable>
<arguments>
<argument>install</argument>
</arguments>
<workingDirectory>${basedir}/src/ui</workingDirectory>
</configuration>
</execution>
<execution>
<id>exec-pnpm-run-build</id>
<phase>validate</phase>
<goals>
<goal>exec</goal>
</goals>
<configuration>
<executable>pnpm</executable>
<arguments>
<argument>build</argument>
</arguments>
<workingDirectory>${basedir}/src/ui</workingDirectory>
</configuration>
</execution>
</executions>
</plugin>到此這篇關(guān)于vue3整合springboot打完整jar包的文章就介紹到這了,更多相關(guān)vue3 springboot打jar包內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
Vue.js項(xiàng)目前端多語言方案的思路與實(shí)踐
前端的國際化是一個比較常見的需求,但網(wǎng)上關(guān)于這一方面的直接可用的方案卻不多,這篇文章主要給大家介紹了關(guān)于Vue.js項(xiàng)目前端多語言方案的思路與實(shí)踐,需要的朋友可以參考下2021-07-07
這篇文章主要為大家詳細(xì)介紹了vue src動態(tài)加載請求獲取圖片的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-10-10
vue項(xiàng)目記錄鎖定和解鎖功能實(shí)現(xiàn)
這篇文章主要為大家詳細(xì)介紹了vue項(xiàng)目記錄鎖定和解鎖功能實(shí)現(xiàn)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
詳解Vue的watch中的immediate與watch是什么意思
這篇文章主要介紹了詳解Vue的watch中的immediate與watch是什么意思，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12
vue開發(fā)之LogicFlow自定義業(yè)務(wù)節(jié)點(diǎn)
這篇文章主要為大家介紹了vue開發(fā)之LogicFlow自定義業(yè)務(wù)節(jié)點(diǎn),有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-01-01
Vue?nextTick獲取更新后的DOM的實(shí)現(xiàn)
本文主要介紹了Vue?nextTick獲取更新后的DOM的實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-01-01
Vue.js實(shí)現(xiàn)輸入框清空功能的兩種方式
Vue.js 是一個流行的前端框架,它提供了多種方法來實(shí)現(xiàn)數(shù)據(jù)的雙向綁定和事件處理,在構(gòu)建表單時,我們經(jīng)常需要實(shí)現(xiàn)清空輸入框的功能,本文將介紹兩種在Vue中實(shí)現(xiàn)輸入框清空功能的方法,感興趣的小伙伴跟著小編一起來看看吧2024-12-12
這篇文章主要介紹了vue中定義的data為什么是函數(shù),vue中已經(jīng)幫我們控制臺輸出警告，并且不會讓組件中的data合并到options中去，那么，很友好的處理了開發(fā)者的強(qiáng)行將data寫成對象的可能性，需要的朋友可以參考下2022-09-09
前端Vue.js實(shí)現(xiàn)json數(shù)據(jù)導(dǎo)出到doc
這篇文章主要介紹了前端Vue.js實(shí)現(xiàn)json數(shù)據(jù)導(dǎo)出到doc，文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下2022-09-09
在Vue中,強(qiáng)制刷新組件通常涉及到以下幾種方法,本文給大家列出了常見的三種vue強(qiáng)制刷新組件的方法,感興趣的朋友跟隨小編一起看看吧2024-04-04