报告器

报告器插件在整个构建过程中从 Parcel 接收事件。例如，报告器可以在构建结束时将状态信息写入标准输出、运行开发服务器或生成包分析报告。

示例

此示例在构建成功时将包数量和构建时间写入标准输出。

import {Reporter} from '@parcel/plugin';

export default new Reporter({
  report({event}) {
    if (event.type === 'buildSuccess') {
      let bundles = event.bundleGraph.getBundles();
      process.stdout.write(`✨ Built ${bundles.length} bundles in ${event.buildTime}ms!\n`);
    }
  }
});

构建开始

当构建开始时，会发出 buildStart 事件。在监视模式下，它会在每次重建开始时发出。

import {Reporter} from '@parcel/plugin';

export default new Reporter({
  report({event}) {
    if (event.type === 'buildStart') {
      process.stdout.write('Started build!\n');
    }
  }
});

构建进度

buildProgress 事件在整个构建过程中发出。它包含一个 phase 属性，指示正在进行的构建阶段，并且事件包含特定于该阶段的附加信息。例如，transforming 阶段中的事件包含正在转换的资产的 filePath 属性。请参阅 BuildProgressEvent。

import {Reporter} from '@parcel/plugin';

export default new Reporter({
  report({event}) {
    if (event.type === 'buildProgress') {
      switch (event.phase) {
        case 'transforming':
          process.stdout.write(`Transforming ${event.filePath}...\n`);
          break;
        case 'resolving':
          process.stdout.write(`Resolving ${event.dependency.specifier}...\n`);
          break;
        case 'bundling':
          process.stdout.write('Bundling...\n');
          break;
        case 'packaging':
          process.stdout.write(`Packaging ${event.bundle.displayName}...\n`);
          break;
        case 'optimizing':
          process.stdout.write(`Optimizing ${event.bundle.displayName}...\n`);
         break;
      }
    }
  }
});

构建成功

当构建成功完成时，会发出 buildSuccess 事件。它包含构建的完整 bundleGraph、buildTime 和 changedAssets 列表。

import {Reporter} from '@parcel/plugin';

export default new Reporter({
  report({event}) {
    if (event.type === 'buildSuccess') {
      process.stdout.write(`✨ Rebuilt ${event.changedAssets.size} assets in ${event.buildTime}ms!\n`);
    }
  }
});

构建失败

当构建完成并出现错误时，会发出 buildFailure 事件。它包含一个 Diagnostic 对象列表，描述错误。有关详细信息，请参阅 诊断。

import {Reporter} from '@parcel/plugin';

export default new Reporter({
  report({event}) {
    if (event.type === 'buildFailure') {
      process.stdout.write(`🚨 Build failed with ${event.diagnostics.length} errors.\n`);
    }
  }
});

日志记录

Parcel 中的所有日志记录都通过报告器插件路由。level 属性指示每个 log 事件的类型。info、warn、error 和 verbose 日志级别包含一个 Diagnostic 对象，它提供有关日志上下文的详细信息。其他日志级别仅包含 message 属性。

import {Reporter} from '@parcel/plugin';

export default new Reporter({
  report({event}) {
    if (event.type === 'log') {
      switch (event.level) {
        case 'info':
        case 'verbose':
          process.stdout.write(`ℹ️ ${event.diagnostic.message}\n`);
          break;
        case 'warn':
          process.stdout.write(`⚠️ ${event.diagnostic.message}\n`);
          break;
        case 'error':
          process.stdout.write(`🚨 ${event.diagnostic.message}\n`);
          break;
      }
    }
  }
});

监视器事件

watchStart 和 watchEnd 事件分别在监视模式开始和结束时发出。与 buildStart 和 buildSuccess/buildFailure 不同，监视器事件仅触发一次，而不是针对每次构建触发。

import {Reporter} from '@parcel/plugin';

export default new Reporter({
  report({event}) {
    if (event.type === 'watchStart') {
      process.stdout.write(`Watching started\n`);
    } else if (event.type === 'watchEnd') {
      process.stdout.write(`Watching ended\n`);
    }
  }
});

相关 API

type ProgressLogEvent = {|

  +type: 'log',

  +level: 'progress',

  +phase?: string,

  +message: string,

|}

type DiagnosticLogEvent = {|

  +type: 'log',

  +level: 'error' | 'warn' | 'info' | 'verbose',

  +diagnostics: Array<Diagnostic>,

|}

type TextLogEvent = {|

  +type: 'log',

  +level: 'success',

  +message: string,

|}

type LogEvent = ProgressLogEvent | DiagnosticLogEvent | TextLogEvent;

type BuildStartEvent = {|

  +type: 'buildStart',

|}

type WatchStartEvent = {|

  +type: 'watchStart',

|}

type WatchEndEvent = {|

  +type: 'watchEnd',

|}

type ResolvingProgressEvent = {|

  +type: 'buildProgress',

  +phase: 'resolving',

  +dependency: Dependency,

|}

type TransformingProgressEvent = {|

  +type: 'buildProgress',

  +phase: 'transforming',

  +filePath: FilePath,

|}

type BundlingProgressEvent = {|

  +type: 'buildProgress',

  +phase: 'bundling',

|}

type PackagingProgressEvent = {|

  +type: 'buildProgress',

  +phase: 'packaging',

  +bundle: NamedBundle,

|}

type OptimizingProgressEvent = {|

  +type: 'buildProgress',

  +phase: 'optimizing',

  +bundle: NamedBundle,

|}

type BuildProgressEvent = ResolvingProgressEvent | TransformingProgressEvent | BundlingProgressEvent | BundledProgressEvent | PackagingProgressEvent | OptimizingProgressEvent;

type BuildSuccessEvent = {|

  +type: 'buildSuccess',

  +bundleGraph: BundleGraph<PackagedBundle>,

  +buildTime: number,

  +changedAssets: Map<string, Asset>,

  +requestBundle: (bundle: NamedBundle) => Promise<BuildSuccessEvent>,

|}

type BuildFailureEvent = {|

  +type: 'buildFailure',

  +diagnostics: Array<Diagnostic>,

|}

type BuildEvent = BuildFailureEvent | BuildSuccessEvent;

type ValidationEvent = {|

  +type: 'validation',

  +filePath: FilePath,

|}

type ReporterEvent = LogEvent | BuildStartEvent | BuildProgressEvent | BuildSuccessEvent | BuildFailureEvent | WatchStartEvent | WatchEndEvent | ValidationEvent;

type Reporter = {|

  report({|
    event: ReporterEvent,
    options: PluginOptions,
    logger: PluginLogger,
  |}): Async<void>,

|}