在前端开发中，我们经常需要记录日志以便于调试和排错。can-log 是一个小巧且灵活的 npm 包，可以帮助我们实现统一的日志记录方案。本文就为大家介绍 can-log 的使用教程。
1. 安装 can-log
可以通过 npm 安装 can-log：
npm install can-log --save
上面命令中，--save 参数将 can-log 添加到当前项目的依赖列表中。
2. 使用 can-log
在代码中使用 can-log，我们需要先导入它：
import canLog from 'can-log';
can-log 主要提供了两个方法：
canLog.log(logLevel, ...messages)canLog[level](...messages)
方法 log 的第一个参数是日志级别，它可以是 debug、info、warn 或 error。...messages 参数是日志消息，类型不限，可以是字符串、数组、对象等。该方法将按照日志级别记录所有消息。
方法 canLog[level] 的参数与方法 log 相同，但它是根据方法名来确定日志级别的。因此，以上四个方法分别对应 canLog.debug、canLog.info、canLog.warn 和 canLog.error。直接调用相应的方法，可以更直观地表达日志级别。
示例代码：
-- -------------------- ---- ------- ------ ------ ---- ---------- -- -- ------------ ---- ------------------- --------- ------------------ ------ -------- ---- ----- ------------------ ------------ ----------- ------------- -- -- --------------- ---- ------------------- ---------- ----------------- ---------- ----------------- ---------- ------------------- ----------
上面代码中，我们分别使用了 canLog.log 和 canLog[level] 两种方式记录了不同级别的日志。
3. 配置 can-log
通过更改 can-log 的配置，我们可以控制它如何记录日志。can-log 的 API 官方文档中提供了很详细的说明，这里我们只罗列常用的一些配置项。
logLevel
可以设定全局的日志级别。可选项有 none、error、warn、info 和 debug，默认为 warn。
示例代码：
import canLog from 'can-log';
// 设置全局的日志级别为 debug
canLog.setLogLevel('debug');
canLog.debug('debug message'); // 记录日志
canLog.info('info message'); // 记录日志上面代码中，我们通过 canLog.setLogLevel 方法设置了全局的日志级别为 debug。因此，所有级别的日志均会被记录下来。
addRule(rule)
可以根据正则表达式，为某些日志记录添加条件判断。例如，只有在 URL 中包含 "debug" 时，才记录 debug 级别的日志。rule 参数应该是一个对象，具有 test 和 logLevel 两个属性。
示例代码：
-- -------------------- ---- ------- ------ ------ ---- ---------- -- -------- ---------------- ----- ------------ --------- ------- --- ------------------- ---------- -- ---- -------------------- ---------- -- -----
上面代码中，我们通过 canLog.addRule 方法添加了一个条件判断规则：只有当 URL 中包含 "debug" 时，才记录 debug 级别的日志。
logToConsole
可以指定是否将日志输出到控制台。默认为 true，表示将所有日志输出到控制台。若值为 false，则不输出任何日志。
示例代码：
import canLog from 'can-log';
// 不将日志输出到控制台
canLog.setLogToConsole(false);
canLog.debug('debug message'); // 不记录日志，也不输出上面代码中，我们通过 canLog.setLogToConsole 方法将日志输出到控制台的功能关闭了。
loggers
可以自定义日志处理器。每个日志处理器是一个函数，它将以数组的形式接收日志级别和日志消息作为参数。
示例代码：
import canLog from 'can-log';
// 定义日志处理器
canLog.addLogger(function(level, messages) {
console.log(level, messages);
});
canLog.debug('debug message'); // 输出：debug ["debug message"]上面代码中，我们通过 canLog.addLogger 方法添加了一个日志处理器。该处理器的作用是将日志输出到控制台。
4. 总结
can-log 是一个小巧、灵活的 npm 包，可以帮助我们实现统一的日志记录方案。本文在介绍 can-log 的基本使用方法和常用配置项的同时，也借此向读者传达了优秀代码的设计原则和工作流程。希望能对前端开发者有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/75740