uniapp開發(fā)打包成H5部署到服務(wù)器的詳細(xì)步驟
前端使用uniapp開發(fā)項(xiàng)目完成后，需要將頁面打包，生成H5的靜態(tài)文件，部署在服務(wù)器上。
這樣通過服務(wù)器鏈接地址，直接可以在手機(jī)上點(diǎn)開來訪問。
打包全步驟如下：
一、點(diǎn)擊菜單欄“發(fā)行”，點(diǎn)擊選擇“網(wǎng)站-PC Web或手機(jī)H5”，
二、填寫網(wǎng)站標(biāo)題和網(wǎng)站域名/服務(wù)器的IP地址。
（這個(gè)地址是將項(xiàng)目打包之后存放靜態(tài)文件的地址)
三、點(diǎn)擊進(jìn)入manifest.json的h5配置里，根據(jù)自己的情況配置一些信息。
一定要注意配置 “運(yùn)行的基礎(chǔ)路徑”，如果出現(xiàn)空白頁面或者靜態(tài)文件404的情況，可能是因?yàn)檫@個(gè)路徑?jīng)]有配置好。
四、點(diǎn)擊發(fā)行，控制臺(tái)會(huì)自動(dòng)編譯。出現(xiàn)以下提示，說明編譯成功：
五、點(diǎn)擊上圖中的紅框部分，就能看到已經(jīng)打包好的靜態(tài)頁面了。（直接把這個(gè)h5文件壓縮一下，發(fā)給后端就可以了）
如需要自己上傳到服務(wù)器上，可繼續(xù)以下步驟。
六、先拿到服務(wù)器的地址信息，找一個(gè)工具，連接上該項(xiàng)目的服務(wù)器，進(jìn)入到服務(wù)器的根目錄底下。
我這里用的是ftp工具。在根目錄底下新建一個(gè)aofan文件夾，然后將上圖中的static文件夾和index.html復(fù)制進(jìn)去即可。
OK，這個(gè)時(shí)候就已經(jīng)部署成功了。
七、打開瀏覽器，輸入服務(wù)器ip地址，訪問一下index.html的內(nèi)容即可。
注意點(diǎn)：這三個(gè)地方的路徑名稱一定要一致。
1：打包時(shí)候的配置的運(yùn)行的基礎(chǔ)路徑
2：服務(wù)器根目錄底下存放靜態(tài)文件static和index.html
3：瀏覽器里面訪問的路徑
到此這篇關(guān)于uniapp如何打包成H5部署到服務(wù)器的文章就介紹到這了,更多相關(guān)uniapp打包成h5內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了vue中路由重定向redirect問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-05-05
在Vue中實(shí)現(xiàn)二維碼生成與掃描功能的方法
二維碼是一種廣泛應(yīng)用于各種場(chǎng)合的編碼方式，它可以將信息編碼成一張二維圖案，方便快捷地傳遞信息，在Vue.js中，我們可以使用一些庫和組件來實(shí)現(xiàn)二維碼的生成和掃描，本文將介紹如何在Vue中實(shí)現(xiàn)二維碼的生成和掃描的方法2023-06-06
詳解vue-cli 3.0 build包太大導(dǎo)致首屏過長(zhǎng)的解決方案
這篇文章主要介紹了詳解vue-cli 3.0 build包太大導(dǎo)致首屏過長(zhǎng)的解決方案，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-11-11
這篇文章主要介紹了vue日期選擇框之時(shí)間范圍的使用，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-05-05
vue+elementUi 實(shí)現(xiàn)密碼顯示/隱藏+小圖標(biāo)變化功能
這篇文章主要介紹了vue+elementUi 實(shí)現(xiàn)密碼顯示/隱藏+小圖標(biāo)變化功能,需本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-01-01
這篇文章主要介紹了element-ui 本地化使用教程詳解，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-10-10
這篇文章主要介紹了項(xiàng)目nginx部署到非根目錄下vue配置方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-12-12
vue-router鉤子函數(shù)實(shí)現(xiàn)路由守衛(wèi)
這篇文章主要介紹了vue-router鉤子函數(shù)實(shí)現(xiàn)路由守衛(wèi)，對(duì)vue感興趣的同學(xué)，可以參考下2021-04-04
vue2移動(dòng)端使用vue-qrcode-reader實(shí)現(xiàn)掃一掃功能的步驟
最近在使用vue開發(fā)的h5移動(dòng)端想要實(shí)現(xiàn)一個(gè)調(diào)用攝像頭掃描二維碼的功能,所以下面這篇文章主要給大家介紹了關(guān)于vue2移動(dòng)端使用vue-qrcode-reader實(shí)現(xiàn)掃一掃功能的相關(guān)資料,需要的朋友可以參考下2023-06-06
今天小編就為大家分享一篇vue 利用路由守衛(wèi)判斷是否登錄的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-09-09