console是前端开发者在开发过程中最常用到的 Web API 之一,然而在使用过程中你是否也遇到过这些困扰:
- 面对控制台同时输出的多个 console,无法清晰的一眼区分它们来自哪个文件;
- 无法快速定位到某一个 console 的源代码所在行;
- 全栈开发过程中在服务端输出复杂对象时,无法方便的查看其结构
- ...
接下来为大家介绍的插件就是致力于优化与解决这些问题的:
Unplugin Turbo Console 是一个通用型插件,旨在增强前端开发人员在使用 console 时的开发者体验(DX)。它拥有许多实用的功能与灵活的可配置项,得益于 Unplugin ,它几乎适用于所有现代前端框架。
它的主要功能有:
高亮输出
基于文件类型(如.js(x), .ts(x), .vue, .svelte, .astro)高亮 Console 输出。并带有文件名,行号,变量名等信息。
自定义前缀和后缀
编辑器跳转
通过点击日志输出中的链接,可以自动打开代码编辑器并跳转到 console 源代码所在行:
传递日志
此功能可以让你在服务端和客户端之间传递日志内容:
服务端 -> 客户端
客户端 -> 服务端
有关插件的详细使用教程以及配置项可以点击文档查看
欢迎大家使用并反馈😀