weinre远程调试工具安装及其使用方法

时间:2021-09-03 10:55:07

weinre安装步骤

1 现在下载node.js安装 (装完要重启 不然环境变量不生效)
2 安装weinre cmd打开运行 npm install weinre -g 在mac上需要( sudo npm install weinre -g 不然会提示没有权限创建文件夹)才能安装成功

3 启动weinre

如果在windows平台上没加任何配置,WIN7下 weinre会安装在 C:\Users\Administrator\AppData\Roaming\npm\node_modules\weinre\weinre,

MAC 会再node /usr/local/lib/node_modules/weinre/weinre –boundHost -all- –httpPort 8082

这个路径自己电脑找不到的话看环境变量 path  npm文件夹的路径
注意路径(文件夹名字)不能空格!!!比方说C:\Documents and Settings
然后启动server:

打开cmd命令行工具,输入:(path-to-weinre-node 换成你的路径)
node path-to-weinre-node/weinre –boundHost -all- –httpPort 8082

成功应该是下面结果

weinre远程调试工具安装及其使用方法

如果不行可以看看端口8082是否开启  netstat

如果运行成功 http://localhost:8082/client/#anonymous这个地址应该能打开

三:weinre的使用例子

步骤一:打开命令行,输入:weinre --boundHost [IP_address] --httpPort [port] (IP_address 是pc的ip地址, 不能是127.0.0.1,port可以输入一个随便的端口)

假设我的pc的ip地址为192.168.1.131,然后我就可以输入这样的命令:weinre --boundHost 192.168.1.131 --httpPort 1234

步骤二:在浏览器上打开网址192.168.1.131:1234,然后我们就可以看到以下界面:

weinre远程调试工具安装及其使用方法

步骤三:我们就按照上面的红色箭头所说的做,先复制一段script到我们所要调试的界面

步骤四:我们就可以点击上面那个连接,然后进入调试界面了。调试界面是下面这个样子的:

weinre远程调试工具安装及其使用方法

 

步骤五:利用手机打开所要调试的页面(也就是刚才添加了script的那个页面,注意要在pc上开启服务器,然后手机通过输入对应地址来访问页面)

步骤六:点击调试页面里对应的Targets,然后点击Elements工具,就可以进行调试了。

weinre远程调试工具安装及其使用方法

调试展示:

点击了<p>标签对应的这一行之后,右边就好像使用chrome开发者工具一样,显示出这个dom结点对应的css了

weinre远程调试工具安装及其使用方法