HarmonyOS NEXT 鸿蒙中手写和使用第三方仓库封装Logger打印工具

应用场景

在鸿蒙开发中，我们在很多时候调试代码都需要用到日志打印工具，但无论是hilog还是console.log,都用起来相对麻烦，而且需要手动将对象转换为JSON字符串的方式才能打印，并且在控制台日志中输出的格式也非常丑。所以下面我们来自己封装一下Logger打印工具。

hilog和console.log的缺点

这是一个完整代码，复制即可使用测试hilog和console.log打印

TypeScript 复制代码

import { hilog } from '@kit.PerformanceAnalysisKit'

const DOMAIN = 0x0000;

@Entry
@Component
struct Test {
  build() {
    Column() {
      Button('点击打印')
        .onClick(() => {
          console.log('console.log打印值')
          hilog.info(DOMAIN, 'testTag', '%{public}s', 'hilog打印值');
        })
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
  }
}

样式很简单，就一个按钮

可以在底部控制栏日志中查看打印

如果这样看好像也么啥，都能打印但是

hilog需要传入好几个参数才能打印自己想打印的那个参数

比如我就想打印个"123456"的字符串，前面需要配三个参数，很麻烦

而console.log不能单独打印对象，必须加上一个字符串类型

而且即使这样能打印，打印出来的也只是类型

必须把对象转为JSON格式的字符串才能打印具体值

基于hilog二次封装一个自己的logger工具

这个工具主要做了

复制代码

1. 封装一个Logger工具类
2. 工具类提供一系列的方法(info, debug, error, warn)
3. 导出一个实例对象, 使用处通过实例对象调用方法

好处是将hilog中一些不需要改变的地方固定起来，使用的时候只需要传入要打印的东西即可，并且支持传入多个参数。

TypeScript 复制代码

/**
 * 1. 封装一个Logger工具类
 * 2. 工具类提供一系列的方法(info, debug, error, warn)
 * 3. 导出一个实例对象, 使用处通过实例对象调用方法
 */
import { hilog } from "@kit.PerformanceAnalysisKit";

const PREFIX = 'utils_logger'

class Logger {
  private domain: number;
  private prefix: string;
  private format: string = "%{public}s, %{public}s";

  constructor(domain: number, prefix: string) {
    this.domain = domain
    this.prefix = prefix
  }

  debug(...args: string[]): void {
    hilog.debug(this.domain, this.prefix, this.format, args);
  }

  info(...args: string[]): void {
    hilog.info(this.domain, this.prefix, this.format, args);
  }

  warn(...args: string[]): void {
    hilog.warn(this.domain, this.prefix, this.format, args);
  }

  error(...args: string[]): void {
    hilog.error(this.domain, this.prefix, this.format, args);
  }
}

export const logger = new Logger(0x1234, PREFIX)

现在在页面中使用试试

打印结果是

现在可以只传想打印的东西，不过也还有缺点，就是还是需要手动将对象转换为JSON

基于第三方库 @abner/log 封装Logger工具

这个第三方工具好用而且可视化效果很好。

在终端引入三方库

bash 复制代码

ohpm install @abner/log

初始化并导出

TypeScript 复制代码

import { Log } from '@abner/log'

// 初始化
Log.init({
  tag: "log_find_easy",
  domain: 0x0101,
  close: false,
  isHilog: true,
  showLogLocation: true,
  logSize: 1024
})

export { Log }

这是相关属性的解释

属性	类型	概述
tag	string	打印的标签，默认为： HarmonyOSLog
domain	number	输出日志所对应的业务领域,默认为0x0000
close	boolean	是否关闭打印，默认true为打开，false为不打印
isHilog	boolean	打印类型，默认为true是hilog打印，false为console
mShowLogLocation	boolean	是否展示点击的位置，默认为true是展示，false为不展示
logSize	number	日志每次输出大小，最大1024字节

在页面中引入使用

打印结果，可以看到，非常的美观，并且对象也是格式化后的，还能把报错的具体位置给显示出来，真的是非常方便。

试用

把下面三个文件放到同一个目录，并在终端通过ohpm install @abner/log引入三方库，就可以直接测试使用。

Test.ets

TypeScript 复制代码

import { hilog } from '@kit.PerformanceAnalysisKit'
import { Log } from './Log';
import { logger } from './Logger';

const DOMAIN = 0x0000;

interface Obj {
  a: number;
  b: string;
}

@Entry
@Component
struct Test {
  obj: Obj = {
    a: 1,
    b: '2'
  }

  build() {
    Column() {
      Button('点击打印')
        .onClick(() => {

          console.log('123', JSON.stringify(this.obj))

          hilog.info(DOMAIN, 'testTag', '%{public}s', '12346');

          logger.info('123')
          logger.debug(JSON.stringify(this.obj))
          logger.warn('123', '123123')
          logger.error('12312', JSON.stringify(this.obj))

          Log.info('123')
          Log.debug(this.obj)
          Log.warn('123', '123123')
          Log.error(this.obj, '123123')

        })
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
  }
}

Logger.ets

TypeScript 复制代码

/**
 * 1. 封装一个Logger工具类
 * 2. 工具类提供一系列的方法(info, debug, error, warn)
 * 3. 导出一个实例对象, 使用处通过实例对象调用方法
 */
import { hilog } from "@kit.PerformanceAnalysisKit";

const PREFIX = 'utils_logger'

class Logger {
  private domain: number;
  private prefix: string;
  private format: string = "%{public}s, %{public}s";

  constructor(domain: number, prefix: string) {
    this.domain = domain
    this.prefix = prefix
  }

  debug(...args: string[]): void {
    hilog.debug(this.domain, this.prefix, this.format, args);
  }

  info(...args: string[]): void {
    hilog.info(this.domain, this.prefix, this.format, args);
  }

  warn(...args: string[]): void {
    hilog.warn(this.domain, this.prefix, this.format, args);
  }

  error(...args: string[]): void {
    hilog.error(this.domain, this.prefix, this.format, args);
  }
}

export const logger = new Logger(0x1234, PREFIX)

Log.ets

TypeScript 复制代码

import { Log } from '@abner/log'

// 初始化
Log.init({
  tag: "log_find_easy",
  domain: 0x0101,
  close: false,
  isHilog: true,
  showLogLocation: true,
  logSize: 1024
})

export { Log }