使用chrome devtools 調試 iphone 頁面,需安裝 remotedebug-ios-webkit-adapter 工具。html
這個 adapter 可牛批壞了,能夠經過VS Code,Chrome DevTools,Mozilla Debugger.html和其餘與Chrome調試協議兼容的工具調試iOS上的Safari和WebViews。ios
且看如下具體步驟。git
在使用此適配器以前,您須要確保安裝了最新版本的iTunes,由於咱們須要iTunes提供的一些庫來與iOS設備通訊。github
一、安裝scoop(windows的包管理工具)web
#修改執行策略,選擇是 or 全是 set-executionpolicy unrestricted -s cu #安裝scoop iex (new-object net.webclient).downloadstring('https://get.scoop.sh')
二、經過scoop安裝 ios_webkit_debug_proxychrome
scoop bucket add extras scoop install ios-webkit-debug-proxy npm install -g vs-libimobile
三、安裝最新版本的 remotedebug-ios-webkit-adapternpm
npm install remotedebug-ios-webkit-adapter -g
四、在Safari中啓用遠程調試
爲了顯示您的iOS設備,您須要啓用啓用開發者模式進行調試。windows
*Iphone => 設置 => Safari 瀏覽器 => 高級 => web檢查器 => 啓用*
五、讓您的計算機信任您的iOS設備
將Iphone手機鏈接電腦,必須點擊「信任」,並打開 itunes, 以確保手機鏈接。瀏覽器
六、打開你喜歡的命令行工具,運行如下命令:app
remotedebug_ios_webkit_adapter --port=9000 #ios-webkit-debug-proxy 將自動爲您運行 無需單獨啓動
七、 打開chrome, 輸入網址: chrome://inspect/#devices
以下圖所示,點擊 inspect, 便可調試。
*指哪打哪,簡直不要太牛批*
PS:請多多指正!別忘記點個贊喲~ 並回敬您一個猿式的微笑。 :)