2019了，你还不会移动端真机调试？

移动端调试坚苦

许多时辰，我们在举办移动端开拓时，都是先在PC端行使手机模仿器举办调试，没有题目后，我们才会在手机端的赏识器举办测试，这个时辰，假如没有呈现题目，皆大欢欣。可是一旦呈现题目，我们就很难办理，由于缺乏可视化的界面。不似在PC端，我们能直观的去改变样式，可能是举办断点调试。偶然，在移动端我们不得不借助于alert来调试，可是这样的调试要领服从极其低下，许多时辰，都是靠履历，可能是靠解除法。乃至，我们不得不归结为是赏识器的实现题目。

那么，有什么什么要领，可以或许让我们调试移动端的适配的时辰，像调试PC端一样直观呢?本文旨在为你提供移动端的调试要领，但愿可以或许为你打开新的一扇门。

本文会给出三种真机调试要领，你可以选择本身最喜好的一款~

移动端真机调试要领

1. chrome真机调试
2. weinre调试
3. spy-debugger调试

简朴声名一下每一种方法的优弱点：

第一种: chrome真机调试，有一个很大的范围性就是，只能调试手机端的chrome赏识器，对付UC，QQ这些赏识器均不合用，因此在调试兼容题目时，辅佐不大，可是最大的利益是: 简朴快捷。

第二种: weinre调试方法，安装和合用不伟大，合用于全平台的调试，即任何手机的任何赏识器皆可以调试，不外必要手机和电脑在统一个网段下。

第三种:spy-debugger，安装轻微伟大一点，spy-debugger集成了weinre，不外还增进了抓包器材，行使最为利便。

下面我们开始详细先容怎样行使这三种调试要领：

1.chrome真机调试

手机端下载好chrome赏识器，行使USB毗连到PC，打开手机的USB调试模式。

然后在PC端打开chrome赏识器，在地点栏输入: chrome://inspect. 勾选"discovery usb device"。然后在手机端赏识网页，就可以看到如下的页面，点击inspect，举办调试。(鉴于我的事变电脑是加了域的，由于并不能行使这个方法，假若有和我一样环境的童鞋，可以思量行使其它两种调试方法)

2.weinre真机调试

Weinre(WebInspector Remote)是一款基于Web Inspector(Webkit)的长途调试器材，借助于收集，可以在PC上直接调试运行在移动设惫亓?长途页面。

当地处事器: 可以行使http-server、tomcat等,也可以行使编译器集成的处事

weinre安装

全局安装: npm install –g weinre

局部安装: npm install weinre

启动: weinre --httpPort 8090 --boundHost -all-

假如是局部安装的话，必要在前面加上 node_modules/.bin/

信托前端的童鞋城市用npm包揽理器材，对付这个器材，我就不睁开了，假如没有安装npm的，自行安装。

weinre启动参数声名:

• httpPort: 配置Wninre行使的端标语，默认是8080
• boundHost: [hostname | Ip | -all-]: 默认是 ‘localhost’.
• debug [true | false] : 这个选项与–verbose相同， 会输出更多的信息。默以为false。
• readTimeout [seconds] : Server发送信息到Target/Client的超时时刻， 默以为5s。
• deathTimeout [seconds] : 默以为3倍的readTimeout， 假如页面高出这个时刻都没有任何相应， 那么就会断开毗连。

8080端口行使环境较多，以是我选择了指定8090端口。

启动了weinre之后，我们在赏识器中输入localhost:8090.表现如下界面，暗示已经启动乐成。

点击debug client user interface，进入调试页面。

当前的targets中内容为空。

此刻，我们必要做其它一点操纵，在我们要调试的页面中，增进一个剧本。

<script src="http://localhost:8090/target/target-script-min.js#anonymous"></script> 

记着将localhost换成你的IP地点.

然后，我们在当地启动一个处事器，可所以IDE集成的处事器，可能是http-server,我行使的是http-server.启动之后，我们在手机端会见要调试的网页。然后就会发明targets下面增进了记录。

这时，我们就可以点击Elements举办调试。

修改样式时，会在手机端即时见效，而且也可以查察节制台信息，独逐一点就是，，不能举办断点调试。

最后，在调试竣事之后，别健忘删除嵌入的script。

除了这种要领之后，还先容了在手机端生涯一段Js代码，在必要调试某个页面时，点击执行JS,可是此刻赏识器为了安详起见，已经不再支持此要领。默认的要领是搜刮，而非执行，以是不行取。

3.spy-debugger真机调试

最后，再先容一下spy-debugger要领。用这个要领，我们不再必要本身增进和删除剧本。

（编辑：河北网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!