その他のオプション

これらは、webpackでサポートされている残りの構成オプションです。

amd

object boolean: false

require.amdまたはdefine.amdの値を設定します。amdをfalseに設定すると、webpackのAMDサポートが無効になります。

webpack.config.js

module.exports = {
  //...
  amd: {
    jQuery: true,
  },
};

AMD用に書かれた特定の人気のあるモジュール（特にjQueryバージョン1.7.0〜1.9.1）は、ローダーがページに複数のバージョンが含まれることについて特別な許可を取っていることを示す場合にのみ、AMDモジュールとして登録されます。

許可は、登録を特定のバージョンに制限したり、異なる定義済みモジュールを持つ異なるサンドボックスをサポートしたりする機能でした。

このオプションを使用すると、モジュールが探しているキーを真の値に設定できます。実際には、webpackのAMDサポートは定義された名前を無視します。

bail

boolean = false

最初のエラーが発生したときに、それを許容するのではなく、失敗します。デフォルトでは、webpackはこれらのエラーをターミナルで赤色でログに記録し、HMRを使用している場合はブラウザコンソールにもログに記録しますが、バンドルを続行します。有効にするには

webpack.config.js

module.exports = {
  //...
  bail: true,
};

これにより、webpackはバンドルプロセスを強制的に終了します。

dependencies

[文字列]

nameのリストで、依存しているすべての兄弟構成を定義します。依存構成は最初にコンパイルする必要があります。

watchモードでは、依存関係が次のときにコンパイラーを無効にします。

依存関係が変更された
依存関係が現在コンパイル中であるか、無効である

依存関係が完了するまで、現在の構成はコンパイルされないことに注意してください。

webpack.config.js

module.exports = [
  {
    name: 'client',
    target: 'web',
    // …
  },
  {
    name: 'server',
    target: 'node',
    dependencies: ['client'],
  },
];

ignoreWarnings

[RegExp, function (WebpackError, Compilation) => boolean, {module?: RegExp, file?: RegExp, message?: RegExp}]

webpackに特定の警告を無視するように指示します。これは、RegExp、WebpackErrorとCompilationを引数として取得し、booleanを返すraw警告インスタンスに基づいて警告を選択するカスタムfunction、または次のプロパティを持つobjectを使用して行うことができます。

file: 警告の元のファイルを選択するRegExp。
message: 警告メッセージを選択するRegExp。
module: 警告の元のモジュールを選択するRegExp。

ignoreWarningsは、上記のいずれかまたはすべてを含むarrayである必要があります。

module.exports = {
  //...
  ignoreWarnings: [
    {
      module: /module2\.js\?[34]/, // A RegExp
    },
    {
      module: /[13]/,
      message: /homepage/,
    },
    /warning from compiler/,
    (warning) => true,
  ],
};

infrastructureLogging

インフラストラクチャレベルのログ記録のオプション。

object = {}

appendOnly

5.31.0+

boolean

既存の出力を更新する代わりに、出力に行を追加します。これは、ステータスメッセージに役立ちます。このオプションは、カスタムのconsoleが提供されていない場合にのみ使用されます。

webpack.config.js

module.exports = {
  //...
  infrastructureLogging: {
    appendOnly: true,
    level: 'verbose',
  },
  plugins: [
    (compiler) => {
      const logger = compiler.getInfrastructureLogger('MyPlugin');
      logger.status('first output'); // this line won't be overridden with `appendOnly` enabled
      logger.status('second output');
    },
  ],
};

colors

5.31.0+

boolean

インフラストラクチャレベルのログ記録にカラフルな出力を有効にします。このオプションは、カスタムのconsoleが提供されていない場合にのみ使用されます。

webpack.config.js

module.exports = {
  //...
  infrastructureLogging: {
    colors: true,
    level: 'verbose',
  },
  plugins: [
    (compiler) => {
      const logger = compiler.getInfrastructureLogger('MyPlugin');
      logger.log('this output will be colorful');
    },
  ],
};

console

5.31.0+

Console

インフラストラクチャレベルのログ記録に使用されるコンソールをカスタマイズします。

webpack.config.js

module.exports = {
  //...
  infrastructureLogging: {
    console: yourCustomConsole(),
  },
};

debug

string boolean = false RegExp function(name) => boolean [string, RegExp, function(name) => boolean]

プラグインやローダーなどの指定されたロガーのデバッグ情報を有効にします。stats.loggingDebugオプションと同様ですが、インフラストラクチャ用です。デフォルトはfalseです。

webpack.config.js

module.exports = {
  //...
  infrastructureLogging: {
    level: 'info',
    debug: ['MyPlugin', /MyPlugin/, (name) => name.contains('MyPlugin')],
  },
};

level

インフラストラクチャのログ出力を有効にします。stats.loggingオプションと同様ですが、インフラストラクチャ用です。デフォルトは'info'です。

可能な値

'none' - ロギングを無効にする
'error' - エラーのみ
'warn' - エラーと警告のみ
'info' - エラー、警告、および情報メッセージ
'log' - エラー、警告、情報メッセージ、ログメッセージ、グループ、クリア。折りたたまれたグループは折りたたまれた状態で表示されます。
'verbose' - デバッグとトレースを除くすべてをログに記録します。折りたたまれたグループは展開された状態で表示されます。

webpack.config.js

module.exports = {
  //...
  infrastructureLogging: {
    level: 'info',
  },
};

stream

5.31.0+

NodeJS.WritableStream = process.stderr

ログ出力に使用されるストリーム。デフォルトはprocess.stderrです。このオプションは、カスタムのconsoleが提供されていない場合にのみ使用されます。

webpack.config.js

module.exports = {
  //...
  infrastructureLogging: {
    stream: process.stderr,
  },
};

loader

オブジェクト

ローダーコンテキストにカスタム値を公開します。

たとえば、ローダーコンテキストに新しい変数を定義できます

webpack.config.js

module.exports = {
  // ...
  loader: {
    answer: 42,
  },
};

次に、ローダーでthis.answerを使用して値を取得します

custom-loader.js

module.exports = function (source) {
  // ...
  console.log(this.answer); // will log `42` here
  return source;
};

name

文字列

構成の名前。複数の構成をロードするときに使用します。

webpack.config.js

module.exports = {
  //...
  name: 'admin-app',
};

parallelism

number = 100

並行処理されるモジュールの数を制限します。パフォーマンスを微調整したり、より信頼性の高いプロファイリング結果を得るために使用できます。

profile

boolean

アプリケーションの「プロファイル」をキャプチャします。これには、統計とヒントが含まれており、分析ツールを使用して分析できます。また、モジュールのタイミングの概要もログに記録します。

recordsInputPath

文字列

最後に記録されたセットを読み込むファイルを指定します。これは、記録ファイルを名前変更するために使用できます。以下の例を参照してください。

recordsOutputPath

文字列

記録を書き込む場所を指定します。次の例は、recordsInputPathと組み合わせてこのオプションを使用して、記録ファイルの名前を変更する方法を示しています

webpack.config.js

const path = require('path');

module.exports = {
  //...
  recordsInputPath: path.join(__dirname, 'records.json'),
  recordsOutputPath: path.join(__dirname, 'newRecords.json'),
};

recordsPath

文字列

このオプションを使用して、複数のビルド間でモジュール識別子を格納するために使用されるwebpack「記録」を含むJSONファイルを生成します。このファイルを使用して、ビルド間でモジュールがどのように変化するかを追跡できます。生成するには、場所を指定します

webpack.config.js

const path = require('path');

module.exports = {
  //...
  recordsPath: path.join(__dirname, 'records.json'),
};

記録は、コード分割を利用する複雑な設定がある場合に特に役立ちます。データを使用して、分割されたバンドルが、必要なキャッシュ動作を達成していることを確認できます。

snapshot

オブジェクト

snapshot オプションは、ファイルシステムのスナップショットがどのように作成および無効化されるかを決定します。

webpack.config.js

const path = require('path');
module.exports = {
  // ...
  snapshot: {
    managedPaths: [path.resolve(__dirname, '../node_modules')],
    immutablePaths: [],
    unmanagedPaths: [],
    buildDependencies: {
      hash: true,
      timestamp: true,
    },
    module: {
      timestamp: true,
    },
    resolve: {
      timestamp: true,
    },
    resolveBuildDependencies: {
      hash: true,
      timestamp: true,
    },
  },
};

buildDependencies

object = { hash boolean = true, timestamp boolean = true }

永続キャッシュを使用する場合のビルド依存関係のスナップショット。

hash: 無効化を判断するためにコンテンツハッシュを比較します (timestamp よりもコストが高いが、変更頻度は少ない)。
timestamp: 無効化を判断するためにタイムスタンプを比較します。

hash と timestamp はどちらもオプションです。

{ hash: true }: タイムスタンプを保持せずハッシュを使用する、フレッシュチェックアウトでの CI キャッシュに適しています。
{ timestamp: true }: ローカル開発キャッシュに適しています。
{ timestamp: true, hash: true }: 上記の両方のケースに適しています。タイムスタンプが最初に比較されます。これは、webpack がハッシュを計算するためにファイルを読み取る必要がないため、コストが低いです。コンテンツハッシュはタイムスタンプが同じ場合にのみ比較されます。これにより、最初のビルドでわずかなパフォーマンス低下が発生します。

immutablePaths

(RegExp | string)[]

パッケージマネージャーによって管理され、パスにバージョンまたはハッシュが含まれているため、すべてのファイルが不変であるパスの配列。

正規表現を使用する場合は、パスをキャプチャグループで囲むようにしてください。

managedPaths

(RegExp | string)[]

パッケージマネージャーによって管理され、それ以外の場合は変更されないと信頼できるパスの配列。

正規表現を使用している場合は、webpack がパスを抽出できるようにパスをキャプチャグループで囲むようにしてください。たとえば、これは webpack が内部的に node_modules ディレクトリに一致させるために使用する正規表現です

/^(.+?[\\/]node_modules)[\\/]/

managedPaths の一般的なユースケースは、node_modules から一部のフォルダーを除外することです。たとえば、webpack に node_modules/@azure/msal-browser フォルダー内のファイルが変更される可能性があることを認識させたい場合があります。これは、以下のような正規表現を使用して行うことができます。

module.exports = {
  snapshot: {
    managedPaths: [
      /^(.+?[\\/]node_modules[\\/](?!(@azure[\\/]msal-browser))(@.+?[\\/])?.+?)[\\/]/,
    ],
  },
};

unmanagedPaths

5.90.0+

(RegExp | string)[]

パッケージマネージャーによって管理されておらず、内容が変更される可能性があるパスの配列。

正規表現を使用する場合は、パスをキャプチャグループで囲むようにしてください。

module

object = {hash boolean = true, timestamp boolean = true}

モジュールの構築のスナップショット。

hash: 無効化を判断するためにコンテンツハッシュを比較します (timestamp よりもコストが高いが、変更頻度は少ない)。
timestamp: 無効化を判断するためにタイムスタンプを比較します。

resolve

object = {hash boolean = true, timestamp boolean = true}

リクエストの解決のスナップショット。

hash: 無効化を判断するためにコンテンツハッシュを比較します (timestamp よりもコストが高いが、変更頻度は少ない)。
timestamp: 無効化を判断するためにタイムスタンプを比較します。

resolveBuildDependencies

object = {hash boolean = true, timestamp boolean = true}

永続キャッシュを使用する場合のビルド依存関係の解決のスナップショット。

hash: 無効化を判断するためにコンテンツハッシュを比較します (timestamp よりもコストが高いが、変更頻度は少ない)。
timestamp: 無効化を判断するためにタイムスタンプを比較します。

さらに詳しく

レコードの使用

このページを編集·このページを印刷

« 前へ

実験

その他のオプション

amd

bail

dependencies

ignoreWarnings

infrastructureLogging

appendOnly

colors

console

debug

level

stream

loader

name

parallelism

profile

recordsInputPath

recordsOutputPath

recordsPath

snapshot

buildDependencies

immutablePaths

managedPaths

unmanagedPaths

module

resolve

resolveBuildDependencies

さらに詳しく

15 貢献者