前端必備移動端調試技能

whistle是基於Node實現的跨平臺web調試代理工具，能夠做爲普通的http代理或者用來抓包、修改、操做http、https、websocket、tunnel請求。 whistle官網

安裝啓動

安裝node、檢查node安裝狀況 node -v

安裝 whistle

1. npm install -g whistle
2. 啓動 w2 start
3. w2 restart、w2 stop

配置代理

1. 移動端須要在設置中配置當前Wi-Fi的代理，

   

2. 手機打開百度，試試看 PC中 【地球network】是否有請求，有則表明ok了

配置rules

利用weinre查看、修改頁面的DOM結構及其樣式

• 左側第二個 列表icon，create建立一個rule， 例如： m.baidu.com weinre://test
• 而後再 手機上打開當前頁面 m.baidu.com，再PC鼠標滑到工具欄 whistle -點擊 test，會打開全新頁面，就能夠再這裏查看調試了。
• 此時能夠看到不少可用工具和功能。