远程调试工具 -- weinre

一、背景状况

　　页面在移动端调试很费力，查看或修改DOM、CSS等都很不方便；

　　 官网：http://people.apache.org/~pmuellr/weinre/docs/1.x/1.5.0/

二、weinre 功能

　　

 

　　一、Element：查看、修改 dom、css

　　二、Resources：查看/修改 localStorage, sessionStorage

　　三、Network：查看网络请求

　　四、console：查看控制台输出

　　不能作得：

　　一、JS调试

三、安装及使用（主要运行场景：本地项目调试）

　　一、安装（weinre时基于nodeJs得）

　　　　npm install  -g weinre

　　二、启动weinre服务

weinre --boundHost 192.168.1.87 --httpPort 8082

　　　　weinre --boundHost  [ IP地址 ]  --httpPort  [ 端口号 ]

　　　　若是出现下面内容就说明启动成功了：

　　　　2018-11-26T02:20:28.598Z weinre: starting server at http://192.168.1.87:8082

　　三、启动服务端口

　　　　http:192.168.1.87:8082

　　　　

　　　　点击：http://192.168.1.87/client/#anonymous 进入如下页面

 　　　　

　　　　targets：none：说明没有链接上

　　四、建立Targets

　　　　建立个页面，并加入如下JS（表示从代理服务中引入target/target-script-min.js）。　　　　

<!- IP是weinre服务的IP -->
<script src="http://192.168.1.87:8082/target/target-script-min.js"></script>

　　　　小编本身用得时候把这个注释了也没报错，我的场景应用不同，只用点联调没涉及更多功能。

　　五、遇到坑

　　　　项目文件应该放在对应得weinre安装路径得www文件夹下面

　　　　例如：D:\node\node_global\node_modules\weinre\web\www\项目文件

　　　　手机和浏览器访问的路径：http://192.168.1.87:8082/www/项目文件