MogoH5+ 如何真機調試(一)

MogoH5+以前的教程有點簡略,所以再出一個比較詳細的分段教程來講明如何使用MogoH5+.

續上文 用vue快速開發app的腳手架工具,若是還不瞭解能夠先看上一篇.

下載腳手架

首先下載腳手架 腳手架項目地址MogoH5+

Git clone

git clone https://github.com/tyaqing/mogo-h5plus.git
複製代碼

直接下載

下載地址

下載後把目錄直接導入到Hbuilder.

運行腳手架

// 1 進入項目主目錄
cd mogo-h5plus
// 2 安裝npm依賴
npm i  // 或者 yarn
// 3 調試運行
npm start

// 運行結果以下
ℹ ｢wds｣: Project is running at http://192.168.199.155:8080/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wdm｣: Hash: e597725cca065f694fbd
Version: webpack 4.10.2
Time: 4959ms
複製代碼

真機調試

將打印出來的ip地址,咱們打印出來的是http://192.168.199.155:8080/,將這個填入頁面入口.

而後使用Hbuilder基座進行調試測試.

常見問題

常見問題通常來講就是白屏問題,或者頁面不存在,可能有如下幾種狀況

1. 電腦和調試的手機須要在同一個局域網下面
2. 腳手架會自動熱更新,無需在冊真機調試
3. 安裝軟件後能夠直接不插線調試,由於同在局域網下
4. npm start後若是局域網ip地址有變,請同時在manifest.json中修改頁面入口

注意

這個針對的是調試,若是要發佈,請看如何發佈打包app