别再手写console.log了,时代变了

579 阅读1分钟

image.png

无论你是 JavaScript 的初学者还是经验丰富的开发人员,都不能否认使用过  console.log  来调试代码。

这并不是什么问题。这是调试代码的好方法。但是,现在可以不必自己手动编写  console.log 了。

我最近发现了一个名为 Turbo Console Log 的 VS Code 扩展,它可以帮你做到这一点:使用键盘快捷键在代码中插入 console.log 语句。

如果想要使用它,首先需要在 VS Code 编辑器中安装该扩展,然后,你可以在任何 JavaScript 文件中使用它:选择要 log 的变量,然后按 ctrl + alt + L (Windows) 或 ctrl + option + L (Mac)。扩展将自动在下一行插入  console.log  语句:

console.log("🚀 ~ file: app.js:230 ~ xxx:", xxx)

如你所见,它还额外包含了文件名与代码行的信息,非常方便。

如下是使用示例:

点击链接查看 GIF 动画示例

此插件还有丰富的配置项,如 turboConsoleLog.logType 可定制 log 的类型,有"log","warn", "error","debug","table"等选项。

还有几个常用的快捷键:

  1. 注释当前文件扩展插入的所有日志消息,按 alt + shift + c (Windows) 或 option + shift + c (Mac)
  2. 取消所有日志消息的注释,alt + shift + u (Windows) 或 option + shift + u (Mac)
  3. 删除当前文件扩展插入的所有日志消息,alt + shift + d (Windows) 或 option + shift + d (Mac)

参考:Do not write console logs yourself ever again