无论你是 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)
如你所见,它还额外包含了文件名与代码行的信息,非常方便。
如下是使用示例:
此插件还有丰富的配置项,如 turboConsoleLog.logType 可定制 log 的类型,有"log","warn", "error","debug","table"等选项。
还有几个常用的快捷键:
- 注释当前文件扩展插入的所有日志消息,按
alt + shift + c(Windows) 或option + shift + c(Mac) - 取消所有日志消息的注释,
alt + shift + u(Windows) 或option + shift + u(Mac) - 删除当前文件扩展插入的所有日志消息,
alt + shift + d(Windows) 或option + shift + d(Mac)