在前端项目中，console 是我们常用的调试工具之一。但是默认的 console 的输出风格比较简单，无法很好地辨认不同类型的信息。 npm 包 better-console 可以帮助我们优化 console 的输出风格，让调试信息更加清晰易读。本文将详细介绍如何使用此 npm 包。
安装 better-console
使用 npm 安装 better-console:
npm install better-console
使用 better-console
导入 better-console：
const console = require('better-console');
然后我们就可以使用 better-console 的优化后的 console 输出了。比如我们要输出一个带有样式的字符串：
console.log('Hello, %c World!', 'color: blue; font-size: 30px');
运行代码后，我们可以看到输出的字符串的样式已经改变了：
除此之外，better-console 还提供了其他一些优化 console 输出的方法，如 console.info、console.warn、console.error、console.dir 等。使用和默认的 console 输出类似，只不过输出的样式更加美观、易读。
下面是一个示例代码：
const console = require('better-console'); console.info('info'); console.warn('warn'); console.error('error'); const myObj = { foo: 'bar', nested: { hello: 'world' } }; console.dir(myObj, { depth: null, colors: true });
运行上面的代码，我们可以得到输出：
配置 better-console
better-console 提供了一些配置项，可用于修改输出样式等设置。更改配置项需要在调用 better-console 之前进行配置。
-- -------------------- ---- ------- ------------------------------------- ------ - ---- ---------- ----- ---------- ----- ---------- ------ --------- -- ---------- ----- --------- ----- ----------- - ------- ---- - ---展开代码
上面的代码配置了在输出时，不同类型的信息所对应的颜色。此外，我们还可以修改是否输出时间戳、是否自动捕获未捕获的异常错误等。
总结
better-console 是一个非常实用的 npm 包，可以帮助我们更好地调试和查看输出信息。通过本文的介绍，你已经可以使用 better-console 优化自己的 console 输出了。如果对 better-console 的更多使用和配置有兴趣，可以参考官方文档。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/70323
