eruda,移动端网页调试神器

2020-11-24 23:22:59

我们在写webapp或者移动端网页需要嵌入到app时候,尤其是在APP内置的webView上加载我们的页面,想要查看手机浏览器信息是非常困难的事,当出现问题的时候,你又不能查看日志,一般会连接本地测试环境,然后在alert来打印日志(这种做法太蠢了),然后一遍一遍的定位bug,修改代码。使用eruda之后感觉爽爆了,解决了这个问题,这个工具就想电脑端的devtools,可以查看日志,网络,页面,Resources等

使用方法

多页面应用

在每个页面

<script type="text/javascript" src="https://cdn.bootcss.com/eruda/1.2.6/eruda.min.js"></script><script>eruda.init();</script>

单页应用

npm install --save-dev eruda

;(function () {
    if (!/mdebug=true/.test(window.location.href)) return;
    var script = document.createElement('script')
    script.src = "https://cdn.bootcss.com/eruda/1.2.6/eruda.min.js"
    script.async = true
    document.getElementsByTagName('head')[0].appendChild(script)
    script.onload = function () {
        eruda.init()
    }})()

我们在项目的入口引用这个文件就可以

我们只需要在地址栏增加mdebug=true即可,是不是很方便?



  • 2019-12-01 08:04:30

    laravel多路由配置,也可以做根据域名都动态路由

    在用laravel 框架开发大型应用的时候,由于 laravel 默认是只有一个路由文件,如果把项目所有模块的路由放在一个路由文件下,那么该路由文件就显得很臃肿,以至于后期难以维护,解决方案是根据不同模块配置不同路由文件。

  • 2019-12-03 15:50:00

    html5 audio stop功能

    html5并没有提供停止功能,我们需要通过其他方式来实现这个问题,下面我们来看下神仙般的操作。

  • 2019-12-03 16:33:49

    hapi,nuxtjs跨域请求

    简单请求 与 预检请求,Fetch 与 CORS 的一个有趣的特性是,可以基于 HTTP cookies 和 HTTP 认证信息发送身份凭证。一般而言,对于跨域 XMLHttpRequest 或 Fetch 请求,浏览器不会发送身份凭证信息。如果要发送凭证信息,需要设置 XMLHttpRequest 的某个特殊标志位。