[TOC]
# Eruda.js
Eruda 是一個專為手機網頁前端設計的調試面板,類似 DevTools 的迷你版,其主要功能包括:捕獲 console 日志、檢查元素狀態、捕獲XHR請求、顯示本地存儲和 Cookie 信息等等;
[github地址](https://github.com/liriliri/eruda)
~~~js
通過cdn引入,方便簡單
<script src="//cdn.bootcdn.net/ajax/libs/eruda/2.3.3/eruda.js"></script>
<script>eruda.init();</script>
~~~
## 吐槽
試過Eruda 想要在線上帶著調試功能 這個東西太大了 還是習慣vconsole
# vconsole.js
效果跟Eruda類似,騰訊旗下出品;[github地址](https://github.com/Tencent/vConsole)
~~~js
<script src="//cdn.bootcdn.net/ajax/libs/vConsole/3.9.1/vconsole.min.js"></script>
<script>const vConsole = new VConsole()</script>
~~~
# 參考
[Eruda 一個小而美的移動端調試神器](https://blog.csdn.net/weixin_43254766/article/details/85032949)
- 前言
- 中文字體
- 移動Web適配方案
- !移動Web基礎!
- 詳解適配相關概念
- 移動開發之設計稿
- 移動適配方案(一)
- 移動適配方案(二)
- vw+rem 實現移動端布局
- 移動端適配之雪碧圖(sprite)背景圖片定位
- 適配 iPhoneX
- 前端開發實戰
- 打造自己的前端開發流程(Gulp)
- flexible.js案例講解
- viewport 與 flexible.js解讀
- 圖片與字體
- 踩過的坑
- 瀏覽器默認樣式
- 300ms點擊延遲和點擊穿透
- ios css
- CSS 常見問題
- Ionic v1混合開發
- Native App、Web App 、Hybrid App?
- ionic項目結構
- 混淆加密
- 解決問題
- cordova
- 環境配置
- 打包發布
- 問題
- 移動前端開發優化
- Web開發之抓包
- ===web移動開發資源===
- H5組件框架
- 調試集合
- 簡單h5調試
- whistle
- devtools-pro