共计 1519 个字符,预计需要花费 4 分钟才能阅读完成。
上文咱们曾经实现了一个利用我的项目的导入、代码更新和代码提交,本章持续讲述一下,如何在开发过程中进行代码的同步联机调试。
4 代码调试
4.1 纯动态 CSS 页面款式查看
代码调试有多种形式,如果是查看纯正的动态款式,能够应用浏览器关上对应页面,或者间接在开发工具上鼠标右键点击页面文件,而后抉择「实时预览」选项,即可在开发工具中查看
4.2 真机联调(重点)
在理论开发中,通常须要这样一种场景,就是对于一些简单交互逻辑的页面的联调。这些页面加载后须要执行一些代码逻辑,或者调用一些手机特有的性能(比方扫描二维码),这时候咱们就须要在实在的手机环境下运行代码,进行开发调试,这种状况咱们就须要应用到上面介绍的真机联调形式了。
真机调试次要有 2 种形式,一种是通过 USE 数据线使手机和电脑连贯进行同步,另一种是通过 Wifi 网络进行真机同步,Wifi 形式更为符合理论开发须要,为了升高老手浏览学习的复杂度,本文重点介绍如果通过 Wifi 形式进行真机联调。
WIFI 真机联调的操作流程:
4.2.1 编译测试利用安装包
关上编译自定义 Loader 页面
编译自定义 Loader
装置自定义 Loader 到手机
PS1:以上操作也能够自行在浏览器里去操作实现,具体为应用浏览器登录官网,在控制台里抉择「模块」-「自定义 Loader」页面进行操作,是同样的成果。其实开发工具中调用的就是浏览器页面,两者是同一个 Web 页面。
PS2: 真机调试能够应用实在的物理手机,也能够在电脑 PC 端装置模拟器软件代替手机进行开发调试。应用模拟器同步速度快,频繁同步也不伤手机,当不具备 WIFI 环境或局域网环境时,特地适宜。不过须要留神因为是模仿软件,绝对于实在手机有肯定的兼容性问题,比方波及应用原生性能 (比方扫描二维码等) 的页面,还是倡议应用物理手机去调试。
PS3:对于模仿的抉择,因为苹果的 iOS 属于闭源零碎,所以以后还是次要抉择安卓模拟器进行代码联调,这里集体举荐应用网易开发的 MuMu 模拟器,理论开发应用成果很不错。下载 apk 安装包后,鼠标双击或者拖动到安装包到模拟器内即可实现装置(下图是 MuMu 模拟器装置测试 Loader 的截图)。
4.2.2 设施连贯
在 Studio3 开发工具中,点击顶部菜单「终端」-「通过 Wi-Fi 连贯新的设施」
正确操作会弹出以下界面, 这个界面不要敞开,前面的连贯会用到
在手机中启动自定义 Loader 利用,可见到以下页面
双击灰色操作球,调起连贯面板,这里就对应到在开发工具上显示的二维码设施连贯界面了
4.2.3 同步数据
建设连贯胜利后,在开发工具中鼠标右键点击根目录,而后「抉择 WIFI 同步【全量】」(也能够应用快捷键操作,不同的操作系统快捷键并不相同,下图是在 MacOS 零碎下的截图)。
PS: 全量和增量的区别,全量是将开发工具内的利用代码全副笼罩到手机的利用上,进行全副替换。而增量是开发工具在同步数据之前会比照开发工具内的代码和利用内的页面代码,会进行页面比照,只替换那些不同的页面。首次同步倡议应用全量,后续应用增量即可。
同步数据实现后,利用会主动重启,显示最新的代码界面, 如下图就是胜利同步代码后的利用界面。
PS:如果 Wifi 同步后没有反馈,查看确认一下利用是否具备存储权限。以后支流的安卓零碎都对利用权限加了限度,没有存储权限,利用无奈保留更新后的代码,所以确保利用具备存储权限,不同的手机零碎可能略有不同,大体是「设置」-「利用」- 抉择你的利用,点击进行详情页,而后点击权限进行查看批改
4.2.4 批改数据,体验下同步成果
让咱们批改一下 html 门路下的 mian.html 文件
批改实现后记得先保留文件
右键根目录或应用快捷键进行 Wif 增量同步
真机同步成果(未完待续…)