# 网页调试工具 > 注：并非所有功能都是默认开启，有些功能需要到油猴菜单中打开【设置】，手动开启功能。 > 一个集合了各种用于调试网页的油猴脚本。 ## 选择调试工具通过油猴菜单，打开`设置`->`总设置`->`调试工具`，选择一个想使用的调试工具。当`开启`菜单功能`允许在iframe内运行`时，会自动将iframe的地址注册到油猴菜单中。 ## erdua - 最新版本：[![npm version](https://img.shields.io/npm/v/eruda/latest.svg?label=eruda)](https://www.npmjs.com/package/eruda) - 当前版本：`3.4.1` - 项目主页
[https://github.com/liriliri/eruda](https://github.com/liriliri/eruda) - 项目最新地址
[https://cdn.jsdelivr.net/npm/eruda](https://cdn.jsdelivr.net/npm/eruda)
[https://fastly.jsdelivr.net/npm/eruda](https://fastly.jsdelivr.net/npm/eruda)
[https://testingcf.jsdelivr.net/npm/eruda](https://testingcf.jsdelivr.net/npm/eruda) - 【插件】![https://github.com/liriliri/eruda-monitor](https://img.shields.io/npm/v/eruda-monitor/latest.svg?label=eruda-monitor) 展示页面的 fps 和内存信息 - 【插件】![https://github.com/liriliri/eruda-features](https://img.shields.io/npm/v/eruda-features/latest.svg?label=eruda-features) 浏览器特性检测 - 【插件】![https://github.com/liriliri/eruda-timing](https://img.shields.io/npm/v/eruda-timing/latest.svg?label=eruda-timing) 展示性能资源数据 - 【插件】![https://github.com/liriliri/eruda-code](https://img.shields.io/npm/v/eruda-code/latest.svg?label=eruda-code) 运行 JavaScript 代码 - 【插件】![https://github.com/liriliri/eruda-benchmark](https://img.shields.io/npm/v/eruda-benchmark/latest.svg?label=eruda-benchmark) 运行 JavaScript 性能测试 - 【插件】[eruda-geolocation](https://github.com/WhiteSevs/eruda-geolocation) 测试地理位置接口 - 【插件】![https://github.com/liriliri/eruda-orientation](https://img.shields.io/npm/v/eruda-orientation/latest.svg?label=eruda-orientation) 测试重力感应接口 - 【插件】![https://github.com/liriliri/eruda-vue](https://img.shields.io/npm/v/eruda-vue/latest.svg?label=eruda-vue) 可以直接在移动端查看调试Vue.js应用 - 【插件】![https://github.com/liriliri/eruda-touches](https://img.shields.io/npm/v/eruda-touches/latest.svg?label=eruda-touches) 可视化屏幕 Touch 事件触发 - 【插件】![https://github.com/pomelo-chuan/eruda-outline-plugin](https://img.shields.io/npm/v/eruda-outline-plugin/latest.svg?label=eruda-outline-plugin) 给页面的元素添加边框 - 【插件】![https://github.com/Faithree/eruda-pixel](https://img.shields.io/npm/v/eruda-pixel/latest.svg?label=eruda-pixel) 这是一个高精度的UI恢复辅助工具，致力于让前端开发人员头疼和崩溃。设计师检查工具。注意：页面中如果存在`CSP策略`，插件将无法加载。使用以下方式可禁用`CSP` - chrome插件 - [Disable Content-Security-Policy](https://chrome.google.com/webstore/detail/disable-content-security/ieelmcmcagommplceebfedjlakkhpden/) - edge插件 - [Disable Content-Security-Policy](https://microsoftedge.microsoft.com/addons/detail/disable-contentsecurity/ecmfamimnofkleckfamjbphegacljmbp?hl=zh-CN) - firefox - 在`about:config`菜单配置中，禁用`security.csp.enable` ## VConsole - 最新版本：[![npm version](https://img.shields.io/npm/v/vconsole/latest.svg?label=vConsole)](https://www.npmjs.com/package/vconsole) - 当前版本：`3.15.1` - 项目主页
[https://github.com/Tencent/vConsole](https://github.com/Tencent/vConsole) - 项目最新地址
[https://cdn.jsdelivr.net/npm/vconsole](https://cdn.jsdelivr.net/npm/vconsole)
[https://fastly.jsdelivr.net/npm/vconsole](https://fastly.jsdelivr.net/npm/vconsole)
[https://testingcf.jsdelivr.net/npm/vconsole](https://testingcf.jsdelivr.net/npm/vconsole) - 【插件】[vconsole-stats-plugin](https://github.com/smackgg/vConsole-Stats): A vConsole plugin which can show Stats in front-end. - 【插件】[vconsole-outputlog-plugin](https://github.com/sunlanda/vconsole-outputlog-plugin): 使用该插件可以复制或下载console中打印的log - 【插件】![https://github.com/Zippowxk/vue-vconsole-devtools](https://img.shields.io/npm/v/vue-vconsole-devtools/latest.svg?label=vue-vconsole-devtools) Vue-vConsole-devtools 是一款vConsole插件，把Vue.js官方调试工具vue-devtools移植到移动端，可以直接在移动端查看调试Vue.js应用 ## PageSpy 🎈注意：默认配置的`test.jikejishu.com`是测试使用，别人也可以看得到你的调试信息，包括Cookie，如果可以请自己部署一个调试服务器 - 最新版本：[![npm version](https://img.shields.io/npm/v/@huolala-tech/page-spy-browser?label=page-spy-browser)](https://www.npmjs.com/package/@huolala-tech/page-spy-browser) - 当前版本：`2.0.2` - 项目主页
[https://github.com/HuolalaTech/page-spy-web](https://github.com/HuolalaTech/page-spy-web) - SDK地址
[https://github.com/HuolalaTech/page-spy/tree/main/packages/page-spy-browser](https://github.com/HuolalaTech/page-spy/tree/main/packages/page-spy-browser) - 项目最新地址
[https://cdn.jsdelivr.net/npm/@huolala-tech/page-spy-browser](https://cdn.jsdelivr.net/npm/@huolala-tech/page-spy-browser)
[https://fastly.jsdelivr.net/npm/@huolala-tech/page-spy-browser](https://fastly.jsdelivr.net/npm/@huolala-tech/page-spy-browser)
[https://testingcf.jsdelivr.net/npm/@huolala-tech/page-spy-browser](https://testingcf.jsdelivr.net/npm/@huolala-tech/page-spy-browser) ## Chii - 项目主页
[https://github.com/liriliri/chii/blob/master/README_CN.md](https://github.com/liriliri/chii/blob/master/README_CN.md) - 调试示例页面(demo)
[https://chii.liriliri.io/](https://chii.liriliri.io/) ## 赞赏支持微信赞赏