其它选项

这里是 webpack 支持的其它选项。

amd

object boolean: false

设置 require.amddefine.amd 的值。设置 amdfalse 会禁用 webpack 的 AMD 支持。

webpack.config.js

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

某些流行的模块是按照 AMD 规范编写的,最引人瞩目的 jQuery 版本在 1.7.0 到 1.9.1,如果 loader 提示它对页面包含的多个版本采取了特殊许可时,才会注册为 AMD 模块。

许可权限是具有「限制指定版本注册」或「支持有不同定义模块的不同沙盒」的能力。

此选项允许将模块查找的键(key)设置为真值(truthy value)。 发生这种情况时,webpack 中的 AMD 支持将忽略定义的名称。

bail

boolean = false

在第一个错误出现时抛出失败结果,而不是容忍它。默认情况下,当使用 HMR 时,webpack 会将在终端以及浏览器控制台中,以红色文字记录这些错误,但仍然继续进行打包。要启用它:

webpack.config.js

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

这将迫使 webpack 退出其打包过程。

dependencies

[string]

一个 name 列表,定义它所依赖的所有兄弟(sibling)配置。需要首先编译依赖的配置。

在 watch 模式下,当出现以下情况时,依赖项将使编译器失效:

  1. 依赖项发生变化
  2. 依赖项当前正在编译或者处于无效状态

请记住,在完成依赖项编译之前,不会编译此配置。

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,可以是自定义 function。如果类型为函数,可基于原始 warning 来选择性展示警告,其参数分别为 WebpackErrorCompilation,且返回值为 boolean。还可以包含以下属性的 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]

开启特定日志比如插件(plugins)和加载器(loaders)的调试信息。 与 stats.loggingDebug 选项类似但仅仅对于基础设施而言。默认为 false

webpack.config.js

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

level

string = 'info' : 'none' | 'error' | 'warn' | 'info' | 'log' | 'verbose'

开启基础设施日志输出。与 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

object

loader 上下文 中暴露自定义值。

例如,你可以在 loader 上下文中定义一个新变量:

webpack.config.js

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

然后使用 this.answer 在 loader 中获取该值:

custom-loader.js

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

name

string

配置的名称。当加载不同的配置时会被使用。

webpack.config.js

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

parallelism

number = 100

限制并行处理的模块数量。可以用于调优性能或获取更可靠的性能分析结果。

profile

boolean

捕获一个应用程序"配置文件",包括统计和提示,然后可以使用 Analyze 分析工具进行详细分析。

recordsInputPath

string

指定读取最后一条记录的文件的名称。这可以用来重命名一个记录文件,可以查看下面的实例:

recordsOutputPath

string

指定记录要写入的位置。以下示例描述了如何用这个选项和 recordsInptuPaht 来重命名一个记录文件:

webpack.config.js

const path = require('path');

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

recordsPath

string

开启这个选项可以生成一个 JSON 文件,其中含有 webpack 的 "records" 记录 - 即「用于存储跨多次构建(across multiple builds)的模块标识符」的数据片段。可以使用此文件来跟踪在每次构建之间的模块变化。只要简单的设置一下路径,就可以生成这个 JSON 文件:

webpack.config.js

const path = require('path');

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

如果你使用了代码分离(code splittnig)这样的复杂配置,records 会特别有用。这些数据用于确保拆分 bundle,以便实现你需要的缓存(caching)行为。

snapshot

object

snapshot 配置项决定文件系统是如何创建和无效快照。

webpack.config.js

const path = require('path');
module.exports = {
  // ...
  snapshot: {
    managedPaths: [path.resolve(__dirname, '../node_modules')],
    immutablePaths: [],
    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:比较 timestamps 以确定无效。

hashtimestamp 都是可选配置。

  • { hash: true }:对 CI 缓存很有帮助,使用新的 checkout,不需要保存时间戳,并且使用哈希。
  • { timestamp: true }:对应本地开发缓存很用帮助。
  • { timestamp: true, hash: true }:对于以上提到的两者都很有帮助。首先比较时间戳,这代价很低,因为 webpack 不需要读取文件来计算它们的哈希值。仅当时间戳相同时才会比较内容哈希,这对初始构建的性能影响很小。

immutablePaths

(RegExp | string)[]

由包管理器管理的路径数组,在其路径中包含一个版本或哈希,以便所有文件都是不可变的(immutable)。

如果使用正则表达式,请确保将路径包裹在捕获组中。

managedPaths

如果使用正则表达式,请确保将路径包裹在捕获组中。

managedPaths

(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:比较时间戳以确定无效。

延伸阅读

15 位贡献者

sokraskipjackterinjokesbyzykliorgreenbvansosninEugeneHlushkoskovyrishabh3112niravasherNeob91chenxsanu01jmg3jamesgeorge007snitin315

Webpack 5 现已正式发布。请阅读我们的 发布公告。如还未准备升级,请阅读 webpack 4 文档