如何在寶塔面板部署vue項目
1、打包自己的vue項目文件
2、寶塔面板登錄 并進入左側網(wǎng)站對應的頁面
3、添加站點
如果沒有域名的可以添加 自己的服務器地址 如果服務器地址已經(jīng) 添加過了 想在服務器其他端口 展示項目則可以 隨便填寫過域名 （ 有域名的可以跳到第6步哦 ）
4、進入當前添加好了的站點 點擊 右側的設置 進入設置頁面
5、添加自己服務器的 地址加端口
（端口：自己想要訪問前端頁面以什么 端口訪問）點擊添加 然后 點擊刪除之前隨便 添加的域名 這里的48.125.35.65是隨便打的
6、進入當前創(chuàng)建好了的站點 對應的文件路徑
（或者直接點擊 根目錄就可以進入）
7、進入當前的目錄后可以選擇是否刪除它的原始文件
（最好還是不要刪除 .htaccess文件 與 .user.ini文件 這邊也不太清楚會不會出現(xiàn)問題） 然后把打包的dist放入進來（這邊就不操作放入了）
配置反向代理
如果需要操作反向代理的話 進入網(wǎng)站對應頁面 設置 找到對應的反向代理 添加反向代理
打開高級功能才會出現(xiàn) 代理目錄 代理目錄要寫前端配置的代理的同樣的（我這邊的前端配置的代理名稱為/consumapi 需要在后面添加個/ 才會有效果）代理名稱隨便寫 目標URL 與 發(fā)送域名 寫自己需要代理地址 內容替換這里看自己的項目（我這邊是沒有這個） 然后點擊提交就可以
部署多個項目
vue-router文件 history 模式 base為/consumption/ base表示在所有路由前都會加上/consumption/
vue.config.js文件 publicPath pusblicePath 指定子路徑
在站點的 設置 配件文件里添加該語句 如果路徑為/consumption/ 則會到當前站點的根目錄下的consumtion文件夾里尋找資源（不知道是不是這樣解釋的）
添加的配置
location ^~ /consumption/ {
try_files $uri $uri/ /consumption/index.html;
} 完整文件
總結
到此這篇關于如何在寶塔面板部署vue項目的文章就介紹到這了,更多相關寶塔部署vue項目內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
Vue中使用XMLHttpRequest（XHR）可以獲取數(shù)據(jù)的方式與傳統(tǒng)的HTML頁面相同，本文主要來和大家講講它的正確使用方法，希望對大家有所幫助2023-05-05
這篇文章主要為大家詳細介紹了vue組件生命周期，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-11-11
Vue項目中使用WebUploader實現(xiàn)文件上傳的方法
WebUploader是由 Baidu WebFE(FEX) 團隊開發(fā)的一個簡單的以 HTML5為主 ， FLASH為輔 的現(xiàn)代 文件上傳組件 。這篇文章主要介紹了在Vue項目中使用WebUploader實現(xiàn)文件上傳,需要的朋友可以參考下2019-07-07
vue css 引入asstes中的圖片無法顯示的四種解決方法
這篇文章主要介紹了vue css 引入asstes中的圖片 無法顯示的幾種解決方案,本文給出了四種解決方法，每種方法給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-03-03
這篇文章主要給大家介紹了關于vue項目中使用天地圖的相關資料,在Vue.js項目中使用天地圖,首先需要申請apikey并在index.html中引入天地圖的js文件,然后創(chuàng)建一個div元素作為地圖容器,并通過CSS設置其樣式,需要的朋友可以參考下2024-11-11
vue2.0 中使用transition實現(xiàn)動畫效果使用心得
這篇文章主要介紹了vue2.0 中使用transition實現(xiàn)動畫效果使用心得，本文通過案例知識給大家介紹的非常詳細，需要的朋友參考下吧2018-08-08
這篇文章主要為大家詳細介紹了vue基于better-scroll仿京東分類列表，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-06-06
Vue Tour 是一個方便的 Vue.js 插件,它可以幫助我們在網(wǎng)站或應用中實現(xiàn)簡單而靈活的頁面導覽功能,本文我們將介紹如何在 Vue 3 中使用 Vue Tour,并通過示例代碼演示其基本用法,需要的朋友可以參考下2024-04-04
Element Table 自適應高度的實現(xiàn)示例
el-table的高度不能適應不同電腦的分辨率,也不能跟隨瀏覽器的高度變化而變化的問題,本文就來解決一下Element Table 自適應高度,感興趣的可以了解一下2024-07-07
詳解vue-cli開發(fā)環(huán)境跨域問題解決方案
本篇文章主要介紹了vue-cli開發(fā)環(huán)境跨域問題解決方案，具有一定的參考價值，感興趣的小伙伴們可以參考一下。2017-06-06