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基座进行调试测试.
常见问题
常见问题一般来说就是白屏问题,或者页面不存在,可能有以下几种情况
- 电脑和调试的手机需要在同一个局域网下面
- 脚手架会自动热更新,无需在册真机调试
- 安装软件后可以直接不插线调试,因为同在局域网下
npm start后如果局域网ip地址有变,请同时在manifest.json中修改页面入口
注意
这个针对的是调试,如果要发布,请看如何发布打包app
