如果你想让你的网页应用有日志记录和分析功能，那么 universal-logger-browser 这个 npm 包是一个不错的选择。它可以方便地在浏览器端收集日志，并将其发送至远程服务端。本文将会详细介绍这个 npm 包的使用方法。
安装
你可以通过以下命令来安装 universal-logger-browser：
npm install universal-logger-browser
初始化
安装完成之后，你需要在你的代码中引入该包：
import UniversalLogger from 'universal-logger-browser';
然后，你需要初始化这个包。它可以接受一个选项对象，其中最基本的选项是 endpoint，它指定了日志服务端的 URL 地址。例如：
const logger = new UniversalLogger({
endpoint: 'https://my-logs-server.com/log',
});在这个例子中，endpoint 指定为 https://my-logs-server.com/log。
发送日志
当你初始化日志器之后，你就可以开始在需要的地方发送日志了。例如：
logger.info('Hello, world!');在这个例子中，我们调用了 logger.info 方法来记录一条信息。你可以使用其他方法来记录其他类型的日志，例如：
logger.error：记录错误信息logger.warn：记录警告信息logger.debug：记录调试信息
设置日志级别
你还可以设置日志级别来控制发布日志的数量。这可以通过初始化选项对象中的 level 来实现。例如：
const logger = new UniversalLogger({
endpoint: 'https://my-logs-server.com/log',
level: 'warn',
});在这个例子中，level 指定为 warn，表示只有警告级别或更高级别的日志才会被发布。你可以使用以下所有级别：'trace'、'debug'、'info'、'warn'、'error'、'fatal'。
添加上下文
有时候，你需要在日志中添加额外的上下文信息，例如当前用户名、请求路径等等。你可以通过向每个日志方法传递第二个参数来实现这点。例如：
logger.info('User logged in', { username: 'john' });在这个例子中，我们将用户名作为一个附加到日志消息的上下文信息。你可以根据需要添加任何其他属性。
自定义包的名称
默认情况下，日志记录器会使用包的名称作为日志记录的来源。你可以通过在初始化选项对象中传递 name 来覆盖默认值。例如：
const logger = new UniversalLogger({
endpoint: 'https://my-logs-server.com/log',
name: 'my-app-logger',
});在这个例子中，logger 的名字被设置为 my-app-logger。
总结
通过本文，你应该已经学会了如何使用 npm 包 universal-logger-browser 来收集和发送日志。你可以根据你的需求调整初始化选项，例如指定日志服务端的 URL 地址，设置日志级别，添加上下文信息和自定义包的名称。祝你好运！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005605481e8991b448de7c0