Cordova 3.x 基础（3） -- 调试工具Debug

[b]（1）Ripple Emulator[/b]
是基于Google Chrome的移动应用模拟器，已经捐赠给了ASF。Apache Ripple：[url=http://ripple.incubator.apache.org/]http://ripple.incubator.apache.org/[/url]

Chrome Webstore安装地址：
[url=https://chrome.google.com/webstore/detail/geelfhphabnejjhdalkjhgipohgpdnoc]https://chrome.google.com/webstore/detail/geelfhphabnejjhdalkjhgipohgpdnoc[/url]

安装Ripple Emulator
[quote]npm install -g ripple-emulator[/quote]

创建Android测试工程app1
[quote]cordova create app1
cd app1
cordova platform add android[/quote]

启动Ripple
[quote]ripple emulate[/quote]

启动Chrome浏览器
http://localhost:4400/?enableripple=cordova-3.0.0
[img]http://dl2.iteye.com/upload/attachment/0093/9402/3bcc0921-4504-32cf-91ae-6f9d3e368410.png[/img]

iOS工程也一样，但是默认Ripple进入Android模拟器，所以会报错，在左侧的Devices那里选择iPhone5 或者 iPad切换设备即可。

[url=http://www.raymondcamden.com/index.cfm/2013/2/6/Using-Ripple-for-PhoneGap-Development]http://www.raymondcamden.com/index.cfm/2013/2/6/Using-Ripple-for-PhoneGap-Development[/url]
[url=http://www.raymondcamden.com/index.cfm/2014/1/17/Installing-and-Using-Ripple-for-Cordova-Development-A-Video]http://www.raymondcamden.com/index.cfm/2014/1/17/Installing-and-Using-Ripple-for-Cordova-Development-A-Video[/url]

[b]（2）weinre[/b]
Web Inspector Remote、是基于WebKit（比如Chrome、Safari）的调试工具。
安装
[quote]npm install weinre[/quote]
启动
[quote]node node_modules\weinre\weinre[/quote]
访问
http://localhost:8080
[img]http://dl2.iteye.com/upload/attachment/0093/9543/9a5755cf-039e-3088-85b5-7e40485f1aa3.png[/img]

**Windows下的安装路径在：
C:\Documents and Settings\RenSanNing\node_modules\weinre

修改www/index.html，添加以下代码：

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

访问以下URL后，Targets有了文件连接后，切换到Elements后就能调试页面了。
http://localhost:8080/client/#HelloCordova
[img]http://dl2.iteye.com/upload/attachment/0093/9541/d561fa76-d22a-3b45-9431-495a3e0663dc.png[/img]

[color=red]要是Targets为none的话，换个IP和端口：[/color]
[quote]node node_modules\weinre\weinre --boundHost 192.168.21.198 --httpPort 9090[/quote]

[b]（3）GapDebug[/b]
Genuitec开发的本地调试Cordova应用（iOS&Android）的工具，免费。Genuitec可能没几个人知道，不过他们开发的MyEclipse没人不知道吧。
[url=https://www.genuitec.com/products/gapdebug/]https://www.genuitec.com/products/gapdebug/[/url]

[img]http://dl2.iteye.com/upload/attachment/0099/2149/89b74c2b-fb86-3345-b707-94335dce38c2.png[/img]

详细可以参考[url=http://www.raymondcamden.com/2014/7/2/GapDebug-a-new-mobile-debugging-tool]这篇文章[/url]。

[b]（4）PhoneGap Developer App[/b]
不需要编译就能在真机上测试应用，GapReload和LiveReload一起使用也可以做到相同的事。通过phonegap serve指令起一个服务器，通过WiFi与一台移动设备上的PhoneGap配对。这台服务器监控代码的变动，并把它们自动地发送到那台设备上，而不用执行本地编译。
[url=http://app.phonegap.com]http://app.phonegap.com[/url]
[img]http://dl2.iteye.com/upload/attachment/0106/5258/51c3a846-bb70-30b8-af58-23a5a8efe977.png[/img]

[b]（5）Ionic View[/b]
[url=http://view.ionic.io/]http://view.ionic.io/[/url]
[img]http://dl2.iteye.com/upload/attachment/0106/5256/960b73da-abe0-3d18-b255-c851462999ac.png[/img]