以下是 webpack 支持的剩余配置选项。
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 支持会忽略已定义的名称。
boolean = false
在第一个错误时失败,而不是容忍它。默认情况下,webpack 会在终端中以红色记录这些错误,并在使用 HMR 时记录在浏览器控制台中,但会继续捆绑。要启用它
webpack.config.js
module.exports = {
//...
bail: true,
};
这将强制 webpack 退出其捆绑过程。
[字符串]
定义所有依赖的同级配置的 name
列表。需要首先编译依赖的配置。
在监视模式下,当
请记住,当前配置在完成其依赖项之前不会编译。
webpack.config.js
module.exports = [
{
name: 'client',
target: 'web',
// …
},
{
name: 'server',
target: 'node',
dependencies: ['client'],
},
];
[RegExp, function (WebpackError, Compilation) => boolean, {module?: RegExp, file?: RegExp, message?: RegExp}]
告诉 webpack 忽略特定警告。可以使用 RegExp
、自定义 function
根据原始警告实例(获取 WebpackError
和 Compilation
作为参数)选择警告并返回 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,
],
};
基础设施级别日志记录选项。
object = {}
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');
},
],
};
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');
},
],
};
控制台
自定义用于基础设施级别日志记录的控制台。
webpack.config.js
module.exports = {
//...
infrastructureLogging: {
console: yourCustomConsole(),
},
};
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')],
},
};
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',
},
};
NodeJS.WritableStream = process.stderr
用于记录输出的流。默认为 process.stderr
。仅当未提供自定义 console
时才使用此选项。
webpack.config.js
module.exports = {
//...
infrastructureLogging: {
stream: process.stderr,
},
};
对象
将自定义值公开到 加载器上下文 中。
例如,可以在加载器上下文中定义一个新变量
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;
};
字符串
配置的名称。在加载多个配置时使用。
webpack.config.js
module.exports = {
//...
name: 'admin-app',
};
数字 = 100
限制并行处理的模块数。可用于微调性能或获取更可靠的分析结果。
boolean
捕获应用程序的“分析”,包括统计信息和提示,然后可以使用 分析 工具对其进行分析。它还将记录模块时序的摘要。
字符串
指定从中读取最后一组记录的文件。这可用于重命名记录文件。请参见以下示例。
字符串
指定应写入记录的位置。以下示例展示了如何将此选项与 recordsInputPath
结合使用来重命名记录文件
webpack.config.js
const path = require('path');
module.exports = {
//...
recordsInputPath: path.join(__dirname, 'records.json'),
recordsOutputPath: path.join(__dirname, 'newRecords.json'),
};
字符串
使用此选项生成包含 webpack “记录”的 JSON 文件,这些数据片段用于在多个构建之间存储模块标识符。可以使用此文件跟踪模块在不同构建之间的变化情况。要生成一个,请指定一个位置
webpack.config.js
const path = require('path');
module.exports = {
//...
recordsPath: path.join(__dirname, 'records.json'),
};
如果您有利用代码拆分的复杂设置,记录特别有用。数据可用于确保拆分包实现您需要的缓存行为。
对象
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,
},
},
};
object = { hash boolean = true, timestamp boolean = true }
使用持久缓存时,用于构建依赖项的快照。
hash
:比较内容哈希以确定失效(比timestamp
更昂贵,但更改频率较低)。timestamp
:比较时间戳以确定失效。hash
和timestamp
都是可选的。
{ hash: true }
:适用于使用全新检出(不保留时间戳并使用哈希)的 CI 缓存。{ timestamp: true }
:适用于本地开发缓存。{ timestamp: true, hash: true }
:适用于上述两种情况。首先比较时间戳,这很便宜,因为 webpack 无需读取文件即可计算其哈希。仅当时间戳相同 时才会比较内容哈希,这会导致初始构建的性能略有下降。(RegExp | string)[]
由包管理器管理且其路径中包含版本或哈希的路径数组,以便所有文件都是不可变的。
如果您使用正则表达式,请务必将路径包装在捕获组中。
(RegExp | string)[]
由包管理器管理且可以信赖不会被其他方式修改的路径数组。
如果您使用正则表达式,请务必将路径包装在捕获组中,以便 webpack 可以提取路径,例如,以下面 webpack 内部用来匹配node_modules
目录的 RegExp 为例
/^(.+?[\\/]node_modules)[\\/]/
managedPaths
的一个常见用例是从node_modules
中排除某些文件夹,例如,您希望 webpack 知道node_modules/@azure/msal-browser
文件夹中的文件可能会发生变化,这可以通过类似于以下内容的正则表达式来实现
module.exports = {
snapshot: {
managedPaths: [
/^(.+?[\\/]node_modules[\\/](?!(@azure[\\/]msal-browser))(@.+?[\\/])?.+?)[\\/]/,
],
},
};
(RegExp | string)[]
不受包管理器管理且内容可能发生更改的路径数组。
如果您使用正则表达式,请务必将路径包装在捕获组中。
object = {hash boolean = true, timestamp boolean = true}
用于构建模块的快照。
hash
:比较内容哈希以确定失效(比timestamp
更昂贵,但更改频率较低)。timestamp
:比较时间戳以确定失效。object = {hash boolean = true, timestamp boolean = true}
用于解析请求的快照。
hash
:比较内容哈希以确定失效(比timestamp
更昂贵,但更改频率较低)。timestamp
:比较时间戳以确定失效。object = {hash boolean = true, timestamp boolean = true}
使用持久缓存时用于解析构建依赖项的快照。
hash
:比较内容哈希以确定失效(比timestamp
更昂贵,但更改频率较低)。timestamp
:比较时间戳以确定失效。