eruda 移动端悬浮调试面板

手机网页前端调试面板,跟 PC端浏览器一样的 DevTools
https://github.com/liriliri/eruda
中文 https://github.com/liriliri/eruda/blob/master/README_CN.md
pnpm add eruda -D
image.png

cdn

  1. <script src="//cdn.bootcdn.net/ajax/libs/eruda/2.3.3/eruda.js"></script>
  2. <script>eruda.init();</script>

eruda=true url 参数控制调试器

通过 url 参数来控制是否加载调试器

  • 当 url 上带有 eruda=true 或本地存储 active-eruda 为 true 的时候,工具才会被加载并执行;
  • 设置面板有选项可以设置 active-eruda 使工具常驻,不用每次都在 url 上添加 eruda=true
    1. ;(function () {
    2. var src = '//cdn.jsdelivr.net/npm/eruda';
    3. if (!/eruda=true/.test(window.location) && localStorage.getItem('active-eruda') != 'true') return;
    4. document.write('<scr' + 'ipt src="' + src + '"></scr' + 'ipt>');
    5. document.write('<scr' + 'ipt>eruda.init();</scr' + 'ipt>');
    6. })();

https://blog.csdn.net/echizao1839/article/details/108418960