如何在寶塔面板部署vue項(xiàng)目
1、打包自己的vue項(xiàng)目文件
2、寶塔面板登錄 并進(jìn)入左側(cè)網(wǎng)站對(duì)應(yīng)的頁面
3、添加站點(diǎn)
如果沒有域名的可以添加 自己的服務(wù)器地址 如果服務(wù)器地址已經(jīng) 添加過了 想在服務(wù)器其他端口 展示項(xiàng)目則可以 隨便填寫過域名 （ 有域名的可以跳到第6步哦 ）
4、進(jìn)入當(dāng)前添加好了的站點(diǎn) 點(diǎn)擊 右側(cè)的設(shè)置 進(jìn)入設(shè)置頁面
5、添加自己服務(wù)器的 地址加端口
（端口：自己想要訪問前端頁面以什么 端口訪問）點(diǎn)擊添加 然后 點(diǎn)擊刪除之前隨便 添加的域名 這里的48.125.35.65是隨便打的
6、進(jìn)入當(dāng)前創(chuàng)建好了的站點(diǎn) 對(duì)應(yīng)的文件路徑
（或者直接點(diǎn)擊 根目錄就可以進(jìn)入）
7、進(jìn)入當(dāng)前的目錄后可以選擇是否刪除它的原始文件
（最好還是不要?jiǎng)h除 .htaccess文件 與 .user.ini文件 這邊也不太清楚會(huì)不會(huì)出現(xiàn)問題） 然后把打包的dist放入進(jìn)來（這邊就不操作放入了）
配置反向代理
如果需要操作反向代理的話 進(jìn)入網(wǎng)站對(duì)應(yīng)頁面 設(shè)置 找到對(duì)應(yīng)的反向代理 添加反向代理
打開高級(jí)功能才會(huì)出現(xiàn) 代理目錄 代理目錄要寫前端配置的代理的同樣的（我這邊的前端配置的代理名稱為/consumapi 需要在后面添加個(gè)/ 才會(huì)有效果）代理名稱隨便寫 目標(biāo)URL 與 發(fā)送域名 寫自己需要代理地址 內(nèi)容替換這里看自己的項(xiàng)目（我這邊是沒有這個(gè)） 然后點(diǎn)擊提交就可以
部署多個(gè)項(xiàng)目
vue-router文件 history 模式 base為/consumption/ base表示在所有路由前都會(huì)加上/consumption/
vue.config.js文件 publicPath pusblicePath 指定子路徑
在站點(diǎn)的 設(shè)置 配件文件里添加該語句 如果路徑為/consumption/ 則會(huì)到當(dāng)前站點(diǎn)的根目錄下的consumtion文件夾里尋找資源（不知道是不是這樣解釋的）
添加的配置
location ^~ /consumption/ {
try_files $uri $uri/ /consumption/index.html;
} 完整文件
總結(jié)
到此這篇關(guān)于如何在寶塔面板部署vue項(xiàng)目的文章就介紹到這了,更多相關(guān)寶塔部署vue項(xiàng)目?jī)?nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
Vue2?Dialog彈窗函數(shù)式調(diào)用實(shí)踐示例
這篇文章主要為大家介紹了Vue2?Dialog彈窗函數(shù)式調(diào)用實(shí)踐示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-01-01
前端前后端接?處理時(shí)經(jīng)常會(huì)遇到需要轉(zhuǎn)換不同時(shí)間格式的情況,下面這篇文章主要給大家介紹了關(guān)于vue各種時(shí)間類型轉(zhuǎn)換的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-06-06
vue-cli3.X快速創(chuàng)建項(xiàng)目的方法步驟
這篇文章主要介紹了vue-cli3.X快速創(chuàng)建項(xiàng)目的方法步驟，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
Vue如何循環(huán)提取對(duì)象數(shù)組中的值
這篇文章主要介紹了Vue如何循環(huán)提取對(duì)象數(shù)組中的值,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-11-11
Vue中select下拉框的默認(rèn)選中項(xiàng)的三種情況解讀
這篇文章主要介紹了Vue中select下拉框的默認(rèn)選中項(xiàng)的三種情況解讀，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-05-05
這篇文章主要給大家詳細(xì)介紹一下Vue3中的基本語法，文中的示例代碼講解詳細(xì)，對(duì)我們學(xué)習(xí)Vue3有一定的幫助，感興趣的小伙伴可以了解一下2022-11-11
vite+vue3+tsx項(xiàng)目打包后動(dòng)態(tài)路由無法加載頁面的問題及解決
這篇文章主要介紹了vite+vue3+tsx項(xiàng)目打包后動(dòng)態(tài)路由無法加載頁面的問題及解決,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
從入門到精通詳解Vue如何實(shí)現(xiàn)防止重復(fù)提交
作為經(jīng)歷過大型項(xiàng)目洗禮的前端工程師,小編深知重復(fù)提交問題絕非簡(jiǎn)單的按鈕禁用就能解決,今天,就將帶大家構(gòu)建一套生產(chǎn)級(jí)的重復(fù)提交防御體系,涵蓋從基礎(chǔ)到架構(gòu)的全套方案2025-06-06
Vue中實(shí)現(xiàn)單向和多向數(shù)據(jù)綁定的方式詳解
在學(xué)習(xí) Vue.js 的過程中,數(shù)據(jù)綁定 是最基礎(chǔ)也是最重要的概念之一,本文將深入講解 Vue 中的兩種數(shù)據(jù)綁定方式,即單向綁定 和 雙向綁定,希望對(duì)大家有所幫助2025-12-12
在vue-cli的組件模板里使用font-awesome的兩種方法
今天小編就為大家分享一篇在vue-cli的組件模板里使用font-awesome的兩種方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-09-09