weinre调试工具的使用

windows下weinre安装环境搭建

weinre是一款远程调试工具,使我们在电脑上直接调试运行在手机上的远程页面。调试的页面在手机上,调试工具在chrome,二者必须在同一个网络内。

1.安装weinre

weinre是基于node.js实现的,所以先要安装node。node下载地址https://nodejs.org/en/download/,安装完毕检测

>node --version

新版的node已经集成npm,可以直接安装weinre

>npm -g install weinre

2.运行weinre

>weinre

3.修改主机ip以及端口

默认情况下为localhost:8080,那么只有本机http://localhost:8080才能访问,如果想要其它设备手机也能访问,那么把localhost替换成all或者指定 ip,

为了避免8080端口被占用,启动一个新的端口(8088)。

4.开始调试

a.PC端打开:本机IP:8088

b.在需要调试的指定页面引入js:

<script src="http://本机IP:8088/target/target-script-min.js#anonymous"></script>

c.进入PC调试界面,调试之前在浏览器打开需要调试的页面,

d.http://本机IP:8020/lesscss/new_file.html发送链接到手机,打开链接即可实时查看调试效果

时间: 2024-08-18 16:41:17

weinre调试工具的使用的相关文章

webapp调试工具weinre的使用

在设计师与前端开发人员的努力下,一个WebApp出炉了,可是测试人员说了一堆的问题:某某机型下页面表现不一致,某某系统下页面如何如何,某某 系统浏览器下页面怎么怎么滴.看着满满的测试汇总文档,我们曾经在一个又一个知名或不知名的手机终端上重复着这些工作:仔细的排查代码,alert可疑的 变量,甚至不惜重构来尝试解决这种不一致的问题.虽然说Android 4.0+以上的移动设备支持桌面版Chrome远程调试,而且在Android 4.4以下也仅限于预览Chrome手机版浏览器内部效果,我们无法在问题

移动端真机调试工具

做移动开发大多数的时候跟手机界面打交道,也就是说你只能在电脑上开发写代码,最终效果是确是在另外一个终端看到的.虽然各种浏览器为开发者提供了很多模拟手机设备的功能,这些功能总体来说基本可以满足我们对于调试移动设备的需求,但是模拟毕竟是模拟,它不能真正做到实现真机一样的效果.经常遇到在chrome模拟器上样式显示正常,在手机上却出现样式错误的情况,在PC端模拟器运行正常,在真机上却报错的情况.所以,必须在想办法在真实的机子上测试我们的代码最终的执行效果.移动端真机调试有几个刚需:看log.看erro

移动端Web开发调试之Weinre调试教程

在设计师与前端开发人员的努力下,一个WebApp出炉了,可是测试人员说了一堆的问题:某某机型下页面表现不一致,某某系统下页面如何如何,某某系统浏览器下页面怎么怎么滴.看着满满的测试汇总文档,我们曾经在一个又一个知名或不知名的手机终端上重复着这些工作:仔细的排查代码,alert可疑的变量,甚至不惜重构来尝试解决这种不一致的问题.虽然说Android 4.0+以上的移动设备支持桌面版Chrome远程调试,而且在Android 4.4以下也仅限于预览Chrome手机版浏览器内部效果,我们无法在问题浏览

移动端开发的知识系统介绍

移动端开发1. 移动端适配:http://suqing.iteye.com/blog/1982733http://www.douban.com/note/261319445/ http://www.woshipm.com/ucd/150207.html<meta name="screen-orientation" content="portrait"><!-- 强制竖屏 --><meta name="x5-orientatio

非常实用的mobile web application远程调试工具 weinre

在移动web应用中,由于没有类似chrome和firebug的调试工具,调试起来比在PC上相对麻烦一些,有时候只能反复进行修改比对,但使用weinre我们可以轻松做到远程调试的功能. 什么是weinre? 官方解释: we是指web,in是指inspector,re是指remote,合起来就是weinre. http://people.apache.org/~pmuellr/weinre/ 如何安装? weinre基于node,使用npm快速安装: npm install weinre 使用 使

移动端调试工具-Weinre

java版本安装和调试 首先需要下载 weinre, weinre目前支持Windows与MacOS, 本文中以Windows版为例. 下载地址:http://people.apache.org/~pmuellr/weinre/builds/1.x/1.6.1/ 点击weinre-jar-1.6.1.zip下载. 然后确保你的电脑已经搭建好了java环境.即安装了jdk.这里就不多说了,在网上搜个jdk,一步步安装及ok. 在下载的weinre.jar所在文件夹中运行以下命令: java -ja

Mobile Web调试工具Weinre (reproduce)

Mobile Web调试工具Weinre 现在.将来,用移动设备上网越来越成为主流.但对于开发者们来说,移动web的调试一直是个难题,前期可以使用模拟器来协助调试,但到了真机调试阶段就让人非常头痛.而Weinre就是解决这难题的利器. Weinre的本意是Web Inspector Remote,它是一种远程调试工具.功能与Firebug.Webkit inspector类似,可以帮助我们即时更改页面元素.样式,调试JS等,下面就简单介绍下如何使用.下面以以Windows系统为例: 一.首先确保

远程调试工具weinre使用教程

一:前言 我们都知道,chrome的开发者工具(f12)是一个方便我们调试PC页面的工具.但是现在我们的开发离不开移动端,那如果我们需要对手机页面进行调试,那该怎么办了? 当然,chrome的开发者工具还是强大的,我们可以再开发者工具中开启device mode来模拟手机调试.具体步骤为: 1. 点击这个图标就可以进入device模式了.   2. 然后我们的界面就变成下面这个样子,通过改变箭头所指的下拉框,就可以模拟不同的移动设备了.: 这个功能确实是很方便我们调试手机页面,但有一个严重的问题

转 Web移动应用调试工具——Weinre

如今人们也越来越习惯在手机上浏览网页,而在手机上这些针对桌面浏览器设计的网页经常惨不忍睹.Web应用开发者需要针对手机进行界面的重新设计,但是手机上并没有称心如意的调试工具(如Firebug.web inspector),重新设计界面的工作往往事半功倍.本文介绍的调试工具Weinre 就是解决这一问题的优秀调试工具. Weinre是什么? Weinre代表We b In spector Re mote,是一种远程调试工具.举个例子,在电脑上可以即时 的更改手机上对应网页的页面元素.样式表,或是查