做移動設備前端開發的時候,比較頭疼的問題是調試。特別是有些問題在pc上不出現,只出現在移動設備上。
使用alert()? 個人覺得不方便而且有點low
1.weinre
附上鏈接 http://people.apache.org/~pmuellr/weinre/
搭建環境不算復雜,有點基礎的人估計5分鍾就能搭建好。
調試界面在pc瀏覽器上,需要移動設備和PC在同一局域網下。
安裝:
1.安裝node(不懂請百度、bing、google)
2.npm install -g wenire (-g 代表全局安裝)
使用:
1.啟動wenire 命令行執行命令 weinre -boundHost 192.168.1.13 -httpPort 8080
-httpPort 可選參數,是啟動端口,默認8080,也可修改為其他可用端口
-boundHost 必選參數,weinre啟動的IP地址
還有其他參數平時用得不多,需要請參考以上鏈接
2.在html或者其他目標文件中引入 <script src="http://192.168.1.13:8080/target/target-script-min.js#anonymous"></script>
注意需要修改IP和端口,與第一步設置的IP 端口一致
3.在Chrome或Safari瀏覽器中打開http://192.168.1.13:8080/client/#anonymous
注意需要修改IP和端口,與第一步設置的IP 端口一致
4.在移動設備上訪問所需調試的頁面
2.vConsole
附上鏈接 https://github.com/WechatFE/vConsole
搭建環境也很簡單,在移動設備上提供了一套接近PC瀏覽器的調試界面。目前感覺是移動設備調試最好用的一個工具,沒有之一
使用:
1.在html或者其他目標文件中引入 <script src="vconsole.js"></script>
2.在移動設備上訪問所需調試的頁面,頁面右下角有個綠色的按鈕,點擊后彈出調試框
如果沒有綠色的按鈕,請在pc上看network面板中vconsole是否請求加載