❶ 如何用手機進行本地前端調試
第一步：連接電腦與手機
1. 手機打開「開發者選項」
安卓手機進入「設置」—>「關於手機」—> 在「版本號」上點7次（或其他的版本號位置，一個個試肯定有……）
然後「開發者選項」就出現在「設置」裡面了。
2. 手機打開「USB調試」
進入「開發者選項」—>打開「USB調試」（如果想手機長亮還要打開「不鎖定屏幕」）
3. 連接並允許調試
用USB數據線將手機與電腦連接—>手機上出現「允許該電腦調試」時點「允許」（可能會晚點出現，先去第二步）
第二步：用電腦啟動手機瀏覽
1. 打開chrome的inspect
在電腦chrome地址欄中輸入chrome://inspect—>勾選「Discover USB devices」
如無意外在Devices中會出現手機型號。
如果沒有，再確認下：開發者選項、USB調試、允許該計算機調試
2. 手機打開chrome app
在手機中打開chrome，這時電腦的chrome inspect中會出現輸網址的地方。
3. 測試手機瀏覽的控制
在電腦chrome inspect輸入框中隨便輸個在線網址，點Open，手機chrome就會打開該頁面。用電腦chrome可以控制刷新、關閉，但是用來調試的inspect點開是空白，應該是被牆了。
第三步：用手機測試本地頁面
1. 開啟本地伺服器
對的，很遺憾手機chrome不能進行靜態頁面的調試。
所以必須開本地伺服器，所幸現在有gulp+webserver，用法這里不講了。
總之，完成這一點後，你應該在電腦上用 http://localhost 來瀏覽網頁了。
2. 電腦chrome開啟埠轉發
在chrome inspect中點「Port forwarding...」—>把埠和localhost鏈接輸進去（比如8000和localhost:8000）—>勾選「Enable port forwarding」—>Done
3. 打開手機瀏覽localhost
如：輸入http://localhost:8000 點Open
這樣手機就能打開頁面了。
❷ 如何在手機上調試h5
眾所周知，我們做前端的寫頁面都是在電腦瀏覽器里調試，但是h5在瀏覽器手機模式和真機還是有區別的，所以這里記錄下我的方法。
步驟：
（1） 建立新的文件夾，進入文件夾，npm init，把要打開的文件拖入
（2） npm install live-server 安裝live-server
（3）在json裡面修改IP改為本地ip，例如：
（4） npm run server，運行生成地址
同方法一，手機和電腦在一個wifi下，這樣地址就可以用手機端訪問了
其他也可以使用Apache HTTP Server
❸ 怎麼在移動端調試web前端
移動端的測試特別簡單，通過改變視窗大小（也就是縮放你的瀏覽器）即可測試。
iphone+ safari 可以直接用satari開發工具調試。chrome+android也有類似的工具組合
❹ 怎麼在移動端調試web前端
響應式測試：Chrome DevTools 面板右側拉伸快速查看效果；Firefox 響應式工具進一步調整；Chrome Emulation 精細測試。
Android 設備測試：使用 Android 虛擬機；優先使用 Weinre 測試，分析用戶瀏覽器使用份額，有針對的進行測試。高版本 Android 測試機，使用 Chrome 連接調試。Android 4.4+ 的 WebView 修改 APP 源代碼，也可以用 Chrome 調試。
低版本系統和其他品牌手機以及 WebView：統統可以用 Weinre 來解決。
iOS 設備測試：使用 Xcode 自帶 iOS 模擬器，使用 Safari 調試；WebView 也可以被電腦上 Safari 調試；測試機連接電腦，也可以用 Safari 調試；MIHTool 可以在 iOS 設備上使用，提供類似 Weinre 的調試功能。
測試多種設備：BrowserStack 和 Keynote。
使用 BrowserSync 可以創建本地區域網 IP 伺服器，並同步操作、監聽刷新，極大減少測試操作，提高測試效率。
當移動端設備無法訪問某項資源時，使用 Charles 做代理，通過電腦去訪問。
❺ 怎麼在移動端調試web前端
可以用Hbuilder開發工具連接手機，ios系統需要在電腦上下載itunes，安卓的話需要下載個手機助手，Hbuilder里有在手機運行的選項的。
❻ 如何在移動設備上調試html5開發的網頁
一、iOS + Safari
1、打開手機web檢查器。
通過【設置】>【Safari】>【高級】>【Web檢查器】打開。見下圖（點擊查看大圖），並且你會看到該選項下面對電腦操作的相應描述，照做就好。
2.鏈接電腦（Mac）
2.1 先在手機Safari中打開你想調試的網頁，並用數據線連接到電腦（我這里是Mac）
2.2 再在電腦上打開Safari點擊【Develop】菜單，就會看到如下圖所示（點擊查看大圖）：
3.3 點擊2.2中的網站名就會在電腦上打開Safari的控制台，如下圖（點擊查看大圖）：
3.調試網頁
如上3.3圖所示，此時你可以查看手機網頁的DOM結構，並且和電腦端網頁調試無異，當滑鼠滑過這些DOM節點的時候手機上的相應布局也會高亮起來，如下圖（點擊查看大圖）：
二、Android + Chrome
1.設置手機
1.1【設置】>【關於手機】>【版本號（Build number）】，對版本號這一項連點7下（這是官方文檔里的說法）就會提示「你已成為開發者」。
1.2 再返回【設置】>【開發者選項】>【USB調試】打開手機USB調試。
2.設置電腦（Mac）
這塊比較麻煩，因為要裝一下Android的SDK。
2.1 下載Android SDK，並解壓，我把整個adt目錄放在了 /Users/David/adt/ 這里。
2.2 設置環境變數 。打開終端在David路徑下（形如 DaviddeMacBook-Pro:~ David$）輸入 open .bash_profile，如果文件存在則會打開，如果不存在則再輸入touch .bash_profile 創建並打開這個文件。在文件里輸入export PATH=$PATH:/Users/David/adt/sdk/platform-tools:/Users/David/adt/sdk/tools ，關閉保存。最後在終端里輸入 source .bash_profile 來更新環境變數使其生效。終端里輸入 adb 出現命令幫助信息就是成功了。
2.3 在終端里輸入 adb forward tcp:9222 localabstract:chrome_devtools_remote 。
3.鏈接電腦
3.1 在手機上的Chrome里打開想要調試的網頁，用數據線連接手機和電腦（我的是Mac。唉～我只是強調平台的不同，不要誤會）。
3.2 打開電腦上的Chrome，在地址欄里輸入 about:inspect 選中 【Discover USB Devices】前面的復選框。出現下圖畫面（點擊查看大圖）：
4.調試網頁
4.1 你可以點擊圖3.2中檢測到的設備上正在運行的網站下面那個【inspect】，或者在瀏覽器中輸入 localhost:9222 打開手機正在瀏覽的網頁列表，如下圖：
4.2 點擊上圖中的網站縮略圖，就會跳轉到Google的一個代理鏈接（鏈接可能被牆……，掛代理）就會打開如下圖所示的控制台（點擊查看大圖）：
4.3 這就和電腦上網頁調試沒什麼差別了，滑鼠經過DOM節點，手機上的布局同樣也會高亮起來：
好的，完結。
❼ 怎麼在移動端調試web前端
移動端的測試特別簡單，通過改變視窗大小（也就是縮放你的瀏覽器）即可測試。
推薦兩個瀏覽器：
Firefox 瀏覽器，內置了響應式測試工具，可以通過 Firefox 工具 -》Web 開發者 -》自適應設計視圖 啟用 來進行調試。
Chrome瀏覽器，和火狐一樣，直接按F12打開開發者模式，點擊那個手機圖標就可以，還有各種預設屏幕尺寸供選擇。
當然還有各種專業的Android 虛擬機和基於 iOS 的各種調試程序，比較多
❽ 怎麼在移動端調試web前端
具體調試步驟如下：,
用 Chrome 模擬 UA、屏幕尺寸 和 觸摸特性，完成第一階段的開發和調試。
但對於國內開發者而言，最大的問題在於國產瀏覽器的各種奇怪BUG。
面對這類沒有調試工具的瀏覽器，weinre 也是一個可行的解決方案。
如果只是對JavaScript的異常進行跟蹤，自己敲幾行代碼也可以勉強處理一下。
引入一個外部鏈接來接收異常信息，藉此把異常顯示到開發環境中，這樣就可以根據異常的信息對 JavaScript 代碼進行跟蹤和定位。
其中大致的實現原理，是通過對 window.onerror 進行一個全局的異常監聽，把捕獲到的異常發送到指定的介面。
❾ 華為榮耀8怎麼連接電腦 移動前端調試
點擊「手機->設置->關於手機->版本號「，點擊7次，即可開啟開發人員選項。點擊返回鍵後，點擊「開發人員選項->開啟USB調試->點擊允許USB調試「。由於Google安全限制，需要進行如上操作才可以打開USB調試，如果彈框未出現，請重新插拔一次USB線