远程调试工具 -- weinre

1、背景情况

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

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

2、weinre 功能

  

  1、Element:查看、修改 dom、css

  2、Resources:查看/修改 localStorage, sessionStorage

  3、Network:查看网络请求

  4、console:查看控制台输出

  不能做得:

  1、JS调试

3、安装及使用(主要运行场景:本地项目调试)

  1、安装(weinre时基于nodeJs得)

    npm install  -g weinre

  2、启动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

  3、启动服务端口

    http:192.168.1.87:8082

    

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

     

    targets:none:说明没有连接上

  4、创建Targets

    创建个页面,并加入以下JS(表示从代理服务中引入target/target-script-min.js)。    

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

    小编自己用得时候把这个注释了也没报错,个人场景应用不一样,只用点联调没涉及更多功能。

  5、遇到坑

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

    例如:D: ode ode_global ode_modulesweinrewebwww项目文件

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

  

原文地址:https://www.cnblogs.com/patriot/p/10018908.html