[TOC]
# DevTools 調試(可以結合使用PC端安卓模擬器)
**打開設備檢查頁面**
在Chrome地址欄,輸入“about:inspect”或通過“菜單”->“工具”->“檢查設備”打開設備檢查頁面:

DevTools工具會自動檢測已連接設備運行的可調試頁面列表,點擊對應頁面的“inspect”鏈接打開調試頁面。
**點擊"inspect"時,如果遇到啟動了一個白屏界面,說明要翻墻才能使用。**
一般情況下,只在第一次使用"inspect"時需要翻墻,以后會緩存在本地。
**無條件翻墻的同學可以嘗試修改本機host的方法來訪問Google相關服務,host內容參考google-hosts,注意及時更新:)**
**頁面調試**
打開調試頁面后DevTools會自動加載相關資源,調試頁面操作方式與普通html調試頁面完全一致。
注意:如果頁面長時間顯示空白頁面,是因為DevTools無法從服務器加載相關的調試資源,需要翻墻才能下載。
>參考:[Chrome調試Android手機之概述](http://ask.dcloud.net.cn/article/69)
- 講解 Markdown
- 示例
- SVN
- Git筆記
- github 相關
- DESIGNER'S GUIDE TO DPI
- JS 模塊化
- CommonJS、AMD、CMD、UMD、ES6
- AMD
- RequrieJS
- r.js
- 模塊化打包
- 學習Chrome DevTools
- chrome://inspect
- Chrome DevTools 之 Elements
- Chrome DevTools 之 Console
- Chrome DevTools 之 Sources
- Chrome DevTools 之 Network
- Chrome DevTools 之 Memory
- Chrome DevTools 之 Performance
- Chrome DevTools 之 Resources
- Chrome DevTools 之 Security
- Chrome DevTools 之 Audits
- 技巧
- Node.js
- 基礎知識
- package.json 詳解
- corepack
- npm
- yarn
- pnpm
- yalc
- 庫處理
- Babel
- 相關庫
- 轉譯基礎
- 插件
- AST
- Rollup
- 基礎
- 插件
- Webpack
- 詳解配置
- 實現 loader
- webpack 進階
- plugin 用法
- 輔助工具
- 解答疑惑
- 開發工具集合
- 花樣百出的打包工具
- 紛雜的構建系統
- monorepo
- 前端工作流
- 爬蟲
- 測試篇
- 綜合
- Jest
- playwright
- Puppeteer
- cypress
- webdriverIO
- TestCafe
- 其他
- 工程開發
- gulp篇
- Building With Gulp
- Sass篇
- PostCSS篇
- combo服務
- 編碼規范檢查
- 前端優化
- 優化策略
- 高性能HTML5
- 瀏覽器端性能
- 前后端分離篇
- 分離部署
- API 文檔框架
- 項目開發環境
- 基于 JWT 的 Token 認證
- 扯皮時間
- 持續集成及后續服務
- 靜態服務器搭建
- mock與調試
- browserslist
- Project Starter
- Docker
- 文檔網站生成
- ddd