什么是 ht-logger？
ht-logger 是一个轻量级的前端日志打印工具，支持多种输出方式，可以方便地记录日志并进行调试。它支持自动获取上下文信息，如当前时间、浏览器信息、页面 URL 等。ht-logger 还提供了基于命令行输入参数的自定义配置选项，从而可以根据需求自定义日志输出格式和输出位置。
快速入门
使用 ht-logger 很简单，只需要在页面中引用它即可：
<script src="path/to/ht-logger.js"></script>
然后就可以在代码中使用全局变量 logger 来记录日志了：
logger.debug('This is a debug log.');
logger.info('This is an info log.');
logger.warn('This is a warning log.');
logger.error('This is an error log.');ht-logger 提供了四个日志等级：debug, info, warn, error。其中 debug 为最低日志等级，error 为最高日志等级。当日志等级不高于当前设定的等级时，对应的日志信息才会被输出。
配置选项
ht-logger 的默认配置如下：
-- -------------------- ---- -------
---------------
------ -------
-------- -
---------- ------- --------- -----------
-------- ------- ----------------------- ----------
--
----------- -
-------- -----
----- -----
-
---level：日志等级，只有不低于该等级的日志才会被输出。
formats：输出格式。根据日志等级和输出方式，可以指定对应的输出格式。可以使用 {time}、{level}、{message}、{file}、{line} 等占位符。
transports：输出方式。目前支持 console 和 file 两种输出方式，分别代表输出到控制台和输出到文件。默认只输出到控制台。
自定义配置
如果想要自定义输出格式或者输出方式，可以调用 config 方法进行配置，例如：
-- -------------------- ---- -------
---------------
------ --------
-------- -
---------- ------- --------- -----------
-------- ------- ----------------------- ----------
--
----------- -
-------- -----
----- -
----- -----------------
------- ------- --------- -----------
-------- ---- - ---- - --- -- ----
------- - -- ----- - -----
-
-
---这里我们将日志等级设为 debug，并且添加了一个 file 输出方式，将日志输出到 ./logs/log.txt 文件中，并且每个日志文件的最大大小为 10MB，保留最近的 5 个日志文件。
示例代码
下面是一个完整的示例代码，展示了如何使用 ht-logger 记录日志并进行调试：
-- -------------------- ---- -------
------
------
----------------------
------- ------------------------------------
--------
---------------
------ --------
----------- -
-------- -----
----- -
----- -----------------
------- ------- ----------------------- -----------
-------- ---- - ---- - ---
------- -
-
-
---
-------- ------ -
----- - - --
----- - - --
----- - - - - --
--------------- --- ---
--------------- --- ---
--------------- --- ---
----------------- ------------
-
---------
-------
------
----------------
------- ------------------------------
-------
-------当我们点击页面上的“Test”按钮后，ht-logger 就会将日志记录输出到控制台和文件中：
2021-06-20 22:08:11 [debug:script.js:14] a = 1 2021-06-20 22:08:11 [debug:script.js:15] b = 2 2021-06-20 22:08:11 [debug:script.js:16] c = 3 2021-06-20 22:08:11 [info:script.js:17] Test finished.
当然，你也可以根据自己的需求自定义输出格式和输出方式，从而方便地进行调试和问题定位。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600562be81e8991b448e0009