Debugging Scheme Based on HTML5 mobile phone technology solutions (such as phonegap)

We always use phonegap, jquery mobile, xui, jqmobi, sencha touch, and jquery touch when developing HTML5-based or mobile cross-platform solutions. These are all front-end development methods, we have to perform front-end debugging like front-end engineers, but fire fox + firebug or chrome developer tools are common front-end methods, however, these methods have encountered the biggest problem when using solutions such as phonegap. Therefore, we have to find another way.

What is it? What versions of mobile support for Dreamweaver cs6.5 or later? It's just a beautiful fantasy. Haha

Let's go back to another powerful tool for front-end debugging. because there are too few other tools, we have to be forced to call it an "artifact"-weinre (Web Inspector remote)

The procedure is as follows:

1. weinre environment construction:

It was okay to use it in the past. You can download the jar package and run it in the Java environment. Now it's not working. The download on GitHub uses the nodejs environment to run. What? You don't know what nodejs is? As a front-end development engineer, this is a sin, because the emergence of this thing can allow js-proficient front-end engineers to directly enter the Development of High-concurrency websites, this article describes how to build a Windows environment.

Download the nodejs installation environment online and install it. After the installation is complete, use the node. js module management tool NPM to download weinre from the node. js module repository. Here, you must remember the apt-Get, yum, and Maven component repository of the Project tool.

In the command line environment of nodejs, everything is done with NPM-install weinre, right? :) Then, you can go to node-modules \ In nodejs \. find weinre in the bin directory. run the CMD command to set a host binding parameter, for example, -- boundhost = 192.168.1.100. In fact, a Web Service is started, and the intermediary proxy transmits and commissions the data in the browser and the browser in the mobile device, so that the data can be periodically communicated from the page.

If you think it is difficult to build your own environment, you can also use the weinre service that has been set up on the public network, but the speed is so slow that you want to skip the building :)

2. Use weinre:

Open a WebKit kernel browser, such as chrome. open http: // 192.168.1.100: 8080/Client # abcdefg (abcdefg is an ID, as long as it is consistent with the ID indicated by the script added to the mobile device ).

Add <SCRIPT src = "http: // 192.168.2.100: 8080/target/target-script-min.js # abcdefg"> </SCRIPT>

3. debugging:

Run the startup page on the mobile device. Debugging can be performed in chrome.

 

For more information on weinre can refer to some information on the Internet: http://www.donglongfei.com/2012/03/debug-phonegap-app-using-weinre? Utm_source = RSS & utm_medium = RSS & utm_campaign = debug-phonegap-app-using-weinre