CC 4.0 授權

本節內容衍生自以下連結的內容，並受 CC BY 4.0 授權約束。
https://webpack.dev.org.tw/api/logging/
如果沒有特別說明，以下內容可被視為基於原始內容進行修改和刪除的結果。

記錄器

記錄輸出是向最終使用者顯示訊息的另一種方式。

Rspack 記錄器可供載入器和外掛使用。作為統計資料的一部分發出，並由使用者在rspack 設定中設定。

Rspack 中自訂記錄 API 的優點

設定記錄顯示等級的通用位置
記錄輸出可作為 stats.json 的一部分匯出
統計預設值會影響記錄輸出
外掛可以影響記錄擷取和顯示等級
當使用多個外掛和載入器時，它們會使用通用的記錄解決方案
Rspack 的 CLI、UI 工具可能會選擇不同的方式來顯示記錄
Rspack 核心可以發出記錄輸出，例如時間數據

透過引入 Rspack 記錄 API，我們希望統一 Rspack 外掛和載入器發出記錄的方式，並允許更好地檢查建置問題。整合式記錄解決方案透過改善開發體驗來支援外掛和載入器開發人員。為非 CLI Rspack 解決方案（如儀表板或其他 UI）鋪路。

避免記錄中的雜訊

避免記錄中的雜訊！

請記住，多個外掛和載入器會一起使用。載入器通常會處理多個檔案，並且會針對每個檔案調用。請選擇盡可能低的記錄等級，以使記錄輸出具有參考價值。

範例

在外掛中

有兩種記錄方法

compilation.getLogger：內容將儲存在統計資料中，當記錄與編譯相關時使用。
compiler.getInfrastructureLogger：內容不會儲存，當記錄在編譯週期之外時使用。

您可以在外掛中使用它們，如下所示

MyPlugin.js

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

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

在載入器中

您可以從載入器內容中取得記錄器，如下所示

MyLoader.js

module.exports = function (source) {
  // access Logger from loader
  const logger = this.getLogger('my-loader');
  logger.info('hello Logger');
  return source;
};

記錄器 API

基本 API

類型： (...args: any[]): void;

方法根據記錄等級從高到低排序

error：用於錯誤訊息。
warn：用於警告。
info：用於重要資訊訊息。這些訊息預設會顯示。僅將此用於使用者確實需要看到的訊息。
log：用於不重要的資訊訊息。這些訊息僅在使用者選擇加入時才會顯示。
debug：用於偵錯資訊。這些訊息僅在使用者選擇加入以查看特定模組的偵錯記錄時才會顯示。

在使用 compilation.getLogger 時，輸出等級可以透過 stats.logging 和 stats.loggingDebug 來控制

rspack.config.js

module.exports = {
  plugins: [{
    apply(compiler) {
      compiler.hooks.thisCompilation.tap("test plugin", compilation => {
        const logger = compilation.getLogger("TEST");
        logger.error("I am an error");
        logger.warn("I am a warning");
        logger.info("I am an information");
        logger.log("I am a log");
        logger.debug("I am a debug log");
      });
    }
  }],
  stats: {
    logging: "verbose",
    loggingDebug: true
  },
};

輸出

asset main.js 264 bytes [emitted] (name: main)
runtime modules 124 bytes 2 modules
./index.js 15 bytes [built] [code generated]

DEBUG LOG from TEST
<e> I am an error
<w> I am a warning
<i> I am an information
    I am a log
    I am a debug log

在使用 compiler.getInfrastructureLogger 時，輸出等級可以透過 infrastructureLogging.level 和 infrastructureLogging.debug 來控制

rspack.config.js

module.exports = {
  plugins: [{
    apply(compiler) {
      compiler.hooks.thisCompilation.tap("test plugin", compilation => {
        const logger = compiler.getInfrastructureLogger("TEST");
        logger.error("I am an error");
        logger.warn("I am a warning");
        logger.info("I am an information");
        logger.log("I am a log");
        logger.debug("I am a debug log");
      });
    }
  }],
  infrastructureLogging: {
    level: "verbose",
    debug: true
  },
};

輸出

<e> [TEST] I am an error
<w> [TEST] I am a warning
<i> [TEST] I am an information
    [TEST] I am a log
    [TEST] I am a debug log
Rspack compiled successfully in 49 ms

assert

當斷言為 false 時顯示錯誤。

等級： error
類型：： assert(assertion: any, ...args: any[]): void;

rspack.config.js

logger.assert(false, "I am an assert error");
logger.assert(true, "Never displayed");

輸出

LOG from TEST
<e> I am an assert error

status

顯示進度狀態資訊，如果存在 console.status，則使用它，否則回退到 console.info。

等級： info
類型： status(...args: any[]): void

rspack.config.js

logger.status("status info");

輸出

[TEST] status info

trace

顯示堆疊追蹤，僅在使用編譯記錄器時可用，也需要啟用 stats.loggingTrace。

等級： debug
類型： trace(): void

rspack.config.js

logger.trace();

輸出

DEBUG LOG from TEST
    Trace
|     at Object.fn
|     at SyncHook.callAsyncStageRange

clear

清除所有記錄，就像 console.clear() 一樣。

等級： log
類型： clear(): void;

rspack.config.js

logger.debug("not displayed");
logger.clear();
logger.debug("will displayed");

輸出

[TEST] will displayed

群組 API

包括這些方法

group(...args: any[]): void：將訊息分組。以摺疊方式顯示，如 logger.log。
groupEnd(...args: any[]): void：結束記錄群組。
groupCollapsed(...args: any[]): void：將訊息分組在一起。以摺疊方式顯示，如 logger.log。當記錄等級設定為 'verbose' 或 'debug' 時，會展開顯示。

rspack.config.js

logger.group("Group");
logger.info("Info");
logger.log("Log");
logger.debug("Debug");
logger.groupCollapsed("Collapsed group");
logger.log("Log inside collapsed group");
logger.group("Inner group");
logger.log("Inner inner message");
logger.groupEnd();
logger.groupEnd();
logger.log("Log");
logger.groupEnd();
logger.log("End");

輸出

<-> [TEST] Group
  <i> [TEST] Info
      [TEST] Log
      [TEST] Debug
  <-> [TEST] Collapsed group
        [TEST] Log inside collapsed group
    <-> [TEST] Inner group
          [TEST] Inner inner message
      [TEST] Log
    [TEST] End

時間 API

包括這些方法

time(label: any): void：啟動計時器。
timeLog(label: any): void：記錄時間差，而不會結束計時器。
timeEnd(label: any): void：結束計時器並記錄時間差。
timeAggregate(label: any): void：彙總擷取時間差。
timeAggregateEnd(label: any): void：結束彙總擷取並記錄總差異。

rspack.config.js

const wait = time => new Promise(resolve => setTimeout(resolve, time))
logger.time("normal");
await wait(100);
logger.timeLog("normal");
await wait(100);
logger.timeEnd("normal");

for (let i = 10;i--;) {
logger.time("aggregate")
await wait(i \* 10);
logger.timeAggregate("aggregate")
}
logger.timeAggregateEnd("aggregate")

輸出

<t> [TEST] normal: 101.091167 ms
<t> [TEST] normal: 202.565 ms
<t> [TEST] aggregate: 460.416124 ms

設定檔 API

包括這些方法

profile(label: any): void：開始擷取設定檔。在支援時委派給 console.profile。
profileEnd(label: any): void：結束擷取設定檔。在支援時委派給 console.profileEnd。

子記錄器

您也可以使用 logger.getChildLogger() 建立子記錄器。子記錄器具有相同的方法。

rspack.config.js

const logger = compiler.getInfrastructureLogger("TEST");
logger.info("logger info");
const childLogger = logger.getChildLogger("CHILD");
childLogger.info("child logger info");

輸出

<i> [TEST] logger info
<i> [TEST/CHILD] child logger info

本頁內容

記錄器#

範例#

在外掛中#

在載入器中#

記錄器 API#

基本 API#

assert#

status#

trace#

clear#

群組 API#

時間 API#

設定檔 API#

子記錄器#

記錄器

範例

在外掛中

在載入器中

記錄器 API

基本 API

assert

status

trace

clear

群組 API

時間 API

設定檔 API

子記錄器