如何在寶塔面板部署vue項目
1、打包自己的vue項目文件

2、寶塔面板登錄 并進(jìn)入左側(cè)網(wǎng)站對應(yīng)的頁面

3、添加站點
如果沒有域名的可以添加 自己的服務(wù)器地址 如果服務(wù)器地址已經(jīng) 添加過了 想在服務(wù)器其他端口 展示項目則可以 隨便填寫過域名 ( 有域名的可以跳到第6步哦 )

4、進(jìn)入當(dāng)前添加好了的站點 點擊 右側(cè)的設(shè)置 進(jìn)入設(shè)置頁面

5、添加自己服務(wù)器的 地址加端口
(端口:自己想要訪問前端頁面以什么 端口訪問)點擊添加 然后 點擊刪除之前隨便 添加的域名 這里的48.125.35.65是隨便打的

6、進(jìn)入當(dāng)前創(chuàng)建好了的站點 對應(yīng)的文件路徑
(或者直接點擊 根目錄就可以進(jìn)入)

7、進(jìn)入當(dāng)前的目錄后可以選擇是否刪除它的原始文件
(最好還是不要刪除 .htaccess文件 與 .user.ini文件 這邊也不太清楚會不會出現(xiàn)問題) 然后把打包的dist放入進(jìn)來(這邊就不操作放入了)

配置反向代理
如果需要操作反向代理的話 進(jìn)入網(wǎng)站對應(yīng)頁面 設(shè)置 找到對應(yīng)的反向代理 添加反向代理

打開高級功能才會出現(xiàn) 代理目錄 代理目錄要寫前端配置的代理的同樣的(我這邊的前端配置的代理名稱為/consumapi 需要在后面添加個/ 才會有效果)代理名稱隨便寫 目標(biāo)URL 與 發(fā)送域名 寫自己需要代理地址 內(nèi)容替換這里看自己的項目(我這邊是沒有這個) 然后點擊提交就可以

部署多個項目
vue-router文件 history 模式 base為/consumption/ base表示在所有路由前都會加上/consumption/

vue.config.js文件 publicPath pusblicePath 指定子路徑

在站點的 設(shè)置 配件文件里添加該語句 如果路徑為/consumption/ 則會到當(dāng)前站點的根目錄下的consumtion文件夾里尋找資源(不知道是不是這樣解釋的)

添加的配置
location ^~ /consumption/ {
try_files $uri $uri/ /consumption/index.html;
} 完整文件

總結(jié)
到此這篇關(guān)于如何在寶塔面板部署vue項目的文章就介紹到這了,更多相關(guān)寶塔部署vue項目內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Vue2?Dialog彈窗函數(shù)式調(diào)用實踐示例
這篇文章主要為大家介紹了Vue2?Dialog彈窗函數(shù)式調(diào)用實踐示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-01-01
Vue中select下拉框的默認(rèn)選中項的三種情況解讀
這篇文章主要介紹了Vue中select下拉框的默認(rèn)選中項的三種情況解讀,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2023-05-05
vite+vue3+tsx項目打包后動態(tài)路由無法加載頁面的問題及解決
這篇文章主要介紹了vite+vue3+tsx項目打包后動態(tài)路由無法加載頁面的問題及解決,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
從入門到精通詳解Vue如何實現(xiàn)防止重復(fù)提交
作為經(jīng)歷過大型項目洗禮的前端工程師,小編深知重復(fù)提交問題絕非簡單的按鈕禁用就能解決,今天,就將帶大家構(gòu)建一套生產(chǎn)級的重復(fù)提交防御體系,涵蓋從基礎(chǔ)到架構(gòu)的全套方案2025-06-06
Vue中實現(xiàn)單向和多向數(shù)據(jù)綁定的方式詳解
在學(xué)習(xí) Vue.js 的過程中,數(shù)據(jù)綁定 是最基礎(chǔ)也是最重要的概念之一,本文將深入講解 Vue 中的兩種數(shù)據(jù)綁定方式,即單向綁定 和 雙向綁定,希望對大家有所幫助2025-12-12
在vue-cli的組件模板里使用font-awesome的兩種方法
今天小編就為大家分享一篇在vue-cli的組件模板里使用font-awesome的兩種方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09

