关于移动端web开发的真机测试

Posted 小艾想偷懒

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于移动端web开发的真机测试相关的知识,希望对你有一定的参考价值。

五月已经过去一大半了,心情不太好,因为太困没状态,所以刚刚去跑了好几圈,心情终于没那么郁闷了,来吧,今天要记录的是在做移动端网页时如何真机测试。

网上方法有很多,我就掌握一个就够了<摊手>

BrowserSync 能让PC,移动端上的页面实时地响应文件的更改,并不用刷新操作。而且,当在一个设备上进行点击等行为时,该行为也会同步到其他浏览器中。

《1》安装

BrowserSync是基于nodejs的,所以在安装它之前,请确保自己的电脑已经安装好nodejs咯。关于nodejsde 安装不想啰嗦了,因为太多东西都是基于nodejs安装好吗。

nodejs安装完成后,才开始对BrowserSync进行简单设置,包括安装与监听

<1>BrowserSync安装

打开终端窗口,输入

npm install  -g browser-sync

稍等一会就安装成功咯。

<2>BrowserSync监听

进入你的项目路径下,files路径是相对于当前路径的,如果需要监听多个类型的文件,需要用逗号隔开。

browser-sync start --server --files"css/*.css,js/*.js,*.html"

<3>移动端设置

   若使用移动端则首先先保证移动端设备和桌面端设备处于同一局域网(用电脑开360无线wifi,然后手机连电脑的wift就可以)。在手机端访问终端上显示的地址:http://192.168.1.0.245:3000,实际情况根据自己的终端显示。

that ‘s all.

 

以上是关于关于移动端web开发的真机测试的主要内容,如果未能解决你的问题,请参考以下文章

移动web开发之移动端真机测试

移动web开发之移动端真机测试

使用 PC 端浏览器开发者工具对移动端真机环境 Web 页面进行远程调试

不依赖wifi热点的移动web真机测试解决方案Carefree

移动端手机调试的几种方法

腾讯优测优分享 | 谈谈移动端屏幕适配的几种方法