Logger 接口

日志输出是向最终用户显示消息的额外方式。

Webpack 日志记录器可用于加载器和插件。它作为统计信息的一部分发出，并由用户在webpack 配置中进行配置。

webpack 中自定义日志 API 的优势

• 配置日志显示级别的常见位置
• 日志输出可作为 stats.json 的一部分导出
• 统计信息预设会影响日志输出
• 插件可以影响日志捕获和显示级别
• 当使用多个插件和加载器时，它们使用通用的日志解决方案
• webpack 的 CLI、UI 工具可以选择不同的方式显示日志
• webpack 核心可以发出日志输出，例如时间数据

通过引入 webpack 日志 API，我们希望统一 webpack 插件和加载器发出日志的方式，并允许更好地检查构建问题。集成的日志解决方案通过改善开发体验来支持插件和加载器开发人员。这为非 CLI 的 webpack 解决方案（例如仪表板或其他 UI）铺平了道路。

如何在加载器和插件中获取和使用 webpack 日志记录器的示例

my-webpack-plugin.js

const PLUGIN_NAME = 'my-webpack-plugin';
export class MyWebpackPlugin {
  apply(compiler) {
    // you can access Logger from compiler
    const logger = compiler.getInfrastructureLogger(PLUGIN_NAME);
    logger.log('log from compiler');

    compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation) => {
      // you can also access Logger from compilation
      const logger = compilation.getLogger(PLUGIN_NAME);
      logger.info('log from compilation');
    });
  }
}

my-webpack-loader.js

module.exports = function (source) {
  // you can get Logger with `this.getLogger` in your webpack loaders
  const logger = this.getLogger('my-webpack-loader');
  logger.info('hello Logger');
  return source;
};

如您从上面的 my-webpack-plugin.js 示例中看到的，有两种类型的日志记录方法，

1. compilation.getLogger
2. compiler.getInfrastructureLogger

建议在插件/日志记录与编译相关时使用 compilation.getLogger，它们将存储在统计信息中。对于发生在编译周期之外的日志记录，请改用 compiler.getInfrastructureLogger。

日志记录器方法

• logger.error(...)：用于错误消息
• logger.warn(...)：用于警告
• logger.info(...)：用于重要信息消息。这些消息默认显示。仅用于用户确实需要看到的消息
• logger.log(...)：用于不重要的信息消息。这些消息仅在用户选择查看时显示
• logger.debug(...)：用于调试信息。这些消息仅在用户选择查看特定模块的调试日志时显示
• logger.trace()：显示堆栈跟踪。显示方式与 logger.debug 类似
• logger.group(...)：用于分组消息。显示为折叠状态，与 logger.log 类似
• logger.groupEnd()：结束一个日志组
• logger.groupCollapsed(...)：将消息分组。显示为折叠状态，与 logger.log 类似。当日志级别设置为 'verbose' 或 'debug' 时显示为展开状态。
• logger.status：写入临时消息，设置新状态，覆盖前一个状态
• logger.clear()：打印一条水平线。显示方式与 logger.log 类似
• logger.profile(...), logger.profileEnd(...)：捕获性能分析。当支持时，委托给 console.profile

运行时日志记录器 API

运行时日志记录器 API 仅用于开发工具，不应包含在生产模式中。

• const logging = require('webpack/lib/logging/runtime')：要在运行时使用日志记录器，请直接从 webpack 引入它
• logging.getLogger('name')：按名称获取单个日志记录器
• logging.configureDefaultLogger(...)：覆盖默认日志记录器。

const logging = require('webpack/lib/logging/runtime');
logging.configureDefaultLogger({
  level: 'log',
  debug: /something/,
});

• logging.hooks.log：将插件应用于运行时日志记录器