当前位置: 代码迷 >> 综合 >> webapp mui HTML5+ (一) 之 环境
  详细解决方案

webapp mui HTML5+ (一) 之 环境

热度:51   发布时间:2023-11-01 18:44:48.0

webapp mui & HTML5+ (一) 之 环境

最近需要开发一款简单app,没有招原生,最后领导大大们商量决定,做webapp,于是这个光荣的任务就落在了小弟身上

小弟以前是做过app,但那是有原生的大神们啊,我做的只是写页面而已…… 多说无益,直接开干

IDE

因为时间关系,框架直接就把react-native忽略掉了,时间不够啊(轻度研究过),直接定在了DCloud上面,主要是打包方便,不用搭建什么环境,直接就可以进行开发

前端框架选定的mui(号称最接近原生APP体验的高性能框架),其实主要是简单容易上手,然后加上5+Runtime

首先选择IDE,跟mui配套的当然是BHuilder了,可以点击这里就是这里了下载

连接

HBuider支持真机调试,这个比较简单,只要安装好手机的驱动,把手机和电脑通过数据线连接就可以调试发布了,如果手机连接不上,可以在电脑和手机上都安装360手机助手基本上就可以了。当然你也可以直接用web打开,但是web没办法调用原生的一些API。今天重点说一下使用夜神安卓模拟器和HBuider的连接调试方法

ios略过,直接看android,夜神模拟器,感觉还可以,夜神模拟器下载

接下来就是就是连接HBuilder和夜神模拟器了,可以更好的进行调试

模拟器

首先启动HBuilder和夜神模拟器

然后打开cmd命令 夜神模拟器连接127.0.0.1:62001

找到你的夜神模拟器的安装位置,右键单击 -> 属性 -> 目标

命令行cd到文件夹目录 D:\yeshenmoniqi\Nox\bin\ 下

执行命令

nox_adb connect 127.0.0.1:62001

nox_adb devices

HBuilder

找到HBuilder 安装目录 右键单击 -> 属性 -> 目标

命令行 cd 到 HBuilder 下的 tools 路径

执行命令

adb connect 127.0.0.1:62001

adb devices

连接成功

运行app

在HBuilder左侧项目管理器中右键单击 -> 新建 -> 移动App -> 填写应用名称(test) -> 选择mui登录模板 -> 点击完成,这样就在本地创建了一个移动app项目

在 HBuilder 中选中你的项目 运行 –> 手机运行 –> 在 [127.0.0.1:62001]设备上运行

然后夜神模拟器就会打开一个带有登录、设置模板的APP,可以注册、登录、退出,一切都是在本地运行的。

本文纯手打,有不当之处请留言!希望能帮到小伙伴们,谢谢!