yusangeng / chivy

浏览器控制台打印工具

chivy

综述

chivy 是一个可配置的前端日志打印工具, 让你可以按照级别和模块管理你的 console.log, 或者通过自定义 driver 完成将控制台打印转发到后台等高级操作.

安装

npm install chivy

使用

配置

chivy 使用 konph 进行配置, konph 用法见: https://www.npmjs.com/package/konph

配置项:

• chivy-level: 当前网页 log 级别, 低于此级别的日志将不会打印. 可填写整数, 默认为 0. 也可填字符串, 字符串到整数换算规则如下(不区分大小写)：

DEBUG: 0 INFO: 1 WARN: 2 ERROR: 3 MUTE: 4

• chivy-modules: 被打开的模块名. 可填一个数组, 或者用","隔开的字符串. 默认为['**']

chivy-modules 中的 module 名使用"/"分割, 每一段称为一个 section, 匹配时以 section 为单位从左向右匹配. chivy-modules 中的 module 名支持单 section 通配符"*"和多 section 通配符"**", 通配符和其他字符不能混用, 一个 section 要么是通配符, 要么是其他字符.

• chivy-driver-flags: driver 打印配置. 类型为形如['color', 'level', 'module', 'time']的数组, 可以通过增删元素选择打印方式或字段：
  • color: 彩色打印.
  • level: 打印日志级别.
  • module：打印模块名称.
  • time：打印日志时间.

注意：由于 driver 可以自定义实现, 此处的 flags 元素和元素解释也可自定义, 由自定义 driver 接收.

配置例子:

window.__Konph = {
  "chivy-level": "warn",
  "chivy-modules": ["**"], // 这样配置会打开所有module
  "chivy-driver-flags": ["color", "level", "module"]
};

代码示例

import Logger from "chivy";

const log = new Logger("project/module");

log.debug("Debug message!");
log.info("Info message!");
log.warn("Warn message!");
log.error("Error message!");

自定义

Logger 通过 Driver 执行打印, Filter 执行过滤. 通过依赖注入, 可以通过自定义 Driver 和 Filter 的方式自定义 chivy 的行为.

例如:

import Logger, { IDriver, IFilter } from "chivy";

class Driver implements IDriver {
  // ...
}

class Filter implements IFilter {
  // ...
}

Logger.injector.Driver = Driver;
Logger.injector.Filter = Filter;

const log = new Logger("foo/bar");

IDriver:

/**
 * 日志打印接口.
 *
 * @export
 * @interface IDriver
 */
export interface IDriver {
  /**
   * 打印日志.
   *
   * @param {Level} level 日志级别
   * @param {string} moduleName 模块名
   * @param {Array} params 其他参数
   *
   * @memberof Driver
   * @instance
   */
  log(level: Level, moduleName: string, ...params: any[]): void;
}

IFilter:

/**
 * 日志过滤器接口.
 *
 * @export
 * @interface IFilter
 */
export interface IFilter {
  /**
   * 过滤日志.
   *
   * 可以通过赋值Logger.injector.logFilter替换.
   *
   * @param {Level} level 日志级别
   * @param {Path} moduleName 模块名
   * @returns {boolean} 需要打印返回true, 否则返回false
   */
  exec(level: Level, moduleName: Path): boolean;
}

其中 Path 是对使用"/"分隔的路径字符串的封装, 提供了 equal, match 和 toString 三个方法, 支持通配符. 如果外部需要使用, 可以通过如下代码引入:

import { IFilter, Path } from "chivy";

class Filter implements IFilter {
  exec(level: Level, moduleName: Path): boolean {
    return moduleName.match("foo/bar/**/Foobar");
  }
}