min-debug 最接地气的前端迷你 debug 日志模块

[chunpu]

min-debug 最接地气的前端迷你 debug 日志模块

Github 地址 min-debug

越来越多的 nodejs 库使用 TJ 的 debug 模块, 它给了我们非常良好的阅读 debug 日志体验

TJ 的 debug 同样可以使用在浏览器中, 通过设置 locaStorage.debug 的值来启动 debug, 使得前端 debug 日志也非常舒服

问题来了, 有这么好的库为什么还要 min-debug

这是因为中国的前端程序员是最让人心疼的, 他们有太多浏览器需要适配

还有移动浏览器(俗称h5)

可以看出 IE8.0 依然占着大部分, IE6-7 也依然占领着一小部分, 即便是 1% 的流量对于 10亿 PV 的服务来说也是一个大数量

而同样, 移动浏览器比如 QQ, 猎豹, 360 也占了巨大的份额

TJ 大大依赖 localStorage 和 Console 的 debug 在移动端和旧版 IE 这些浏览器上难以施展

这时候 min-debug 就派上了用场

除了提供 debug 一样的 localStorage 方式, 对于无法查看 Console 的浏览器, 提供直接显示在页面上的 debug 日志方式, 甚至支持 IE6, 对于手机的日志显示也非常方便

多团队使用互不干扰

min-debug 支持自定义 debug key, 默认和 TJ 的 debug 一样都是 "debug", 对于有不同团队维护的网站, 可以使用不同的 debug key 做到互不干扰

比如

• sns 团队用 localStorage.snsdebug = '*'
• 内容团队用 localStorage.contentdebug = '*'
• 用户登陆团队用 localStorage.userdebug = '*'

非常小

min-debug gzip 压缩后仅不到 500b

Feedback

min-debug 虽然不会有问题反馈(即发送调试日志)功能, 但由于使用了 <textarea>, 用户要把日志发送给开发者, 在电脑上 Ctrl + A 全选还是在手机网页上长按全选日志都很方便

min-debug 中的 namespace 和 通配符

这点照抄了 TJ 大大的 debug#wildcards

例如

localStorage.debug = 'main, session:*' 显示 main, 和所有 session 开头的

localStorage.debug = '*, -*verbose*' 显示除了 namespace 中带有 verbose 的 debug 日志

Github Repo

min-debug github

[yutingzhao1991]

教主是要把jssdk里面的debug模块替换么！

[chunpu]

只是把jssdk 的debug 开源了而已

[yutingzhao1991]

噢 min-debug 是你自己搞的啊.....

[yutingzhao1991]

不错不错