object
string
stats
选项让你更精确地控制 bundle 信息该怎么显示。 如果你不希望使用 quiet
或 noInfo
这样的不显示信息,而是又不想得到全部的信息,只是想要获取某部分 bundle 的信息,使用 stats 选项是比较好的折衷方式。
module.exports = {
//...
stats: 'errors-only',
};
webpack 有一些特定的预设选项给统计信息输出:
预设 | 可选值 | 描述 |
---|---|---|
'errors-only' | none | 只在发生错误时输出 |
'errors-warnings' | none | 只在发生错误或有新的编译时输出 |
'minimal' | none | 只在发生错误或新的编译开始时输出 |
'none' | false | 没有输出 |
'normal' | true | 标准输出 |
'verbose' | none | 全部输出 |
'detailed' | none | 全部输出除了 chunkModules 和 chunkRootModules |
'summary' | none | 输出 webpack 版本,以及警告数和错误数 |
你可以在统计输出里指定你想看到的信息。
当统计信息配置没被定义,则该值是一个回退值。它的优先级比本地的 webpack 默认值高。
module.exports = {
//...
stats: {
all: undefined,
},
};
boolean = true
告知 stats
是否展示资源信息。将 stats.assets
设置成 false
会禁用.
module.exports = {
//...
stats: {
assets: false,
},
};
string = 'id'
告知 stats
基于给定的字段对资源进行排序。所有的 排序字段都被允许作为 stats.assetsSort
的值。使用 !
作为值的前缀以反转基于给定字段的排序结果。
module.exports = {
//...
stats: {
assetsSort: '!size',
},
};
boolean = true
告知 stats
是否添加构建日期与时间信息。将 stats.builtAt
设置成 false
来隐藏.
module.exports = {
//...
stats: {
builtAt: false,
},
};
boolean = true
告知 stats
是否添加模块内的资源信息。将 stats.moduleAssets
设置成 false
以隐藏。
module.exports = {
//...
stats: {
moduleAssets: false,
},
};
number = 15
告诉 stats
应该显示多少个 asset 项目(将以组的方式折叠,以适应这个空间)。
module.exports = {
//...
stats: {
assetsSpace: 15,
},
};
number = 15
告诉 stats
应该显示多少个模块项目(将以组的方式折叠,以适应这个空间)。
module.exports = {
//...
stats: {
modulesSpace: 15,
},
};
number = 10
告诉 stats
显示多少个 chunk 模块项目(将以组的方式折叠,以适应这个空间)。
module.exports = {
//...
stats: {
chunkModulesSpace: 15,
},
};
boolean
告知 stats
是否添加嵌套在其他模块中的模块信息(比如模块联邦)。
module.exports = {
//...
stats: {
nestedModules: true,
},
};
number = 10
告诉 stats
应该显示多少个嵌套模块的项目(将以组的方式折叠,以适应这个空间)。
module.exports = {
//...
stats: {
nestedModulesSpace: 15,
},
};
旧版的 stats.cachedModules
.
boolean = true
告诉 stats
是否要缓存(非内置)模块的信息。
module.exports = {
//...
stats: {
cachedModules: false,
},
};
boolean = true
告诉 stats
是否要添加运行时模块的信息。
module.exports = {
//...
stats: {
runtimeModules: false,
},
};
boolean
告诉 stats
是否要展示该 chunk 依赖的其他模块的 chunk 模块。
module.exports = {
//...
stats: {
dependentModules: false,
},
};
boolean
告诉 stats
是否按照 asset 与 chunk 的关系进行分组。
module.exports = {
//...
stats: {
groupAssetsByChunk: false,
},
};
boolean
告诉 stats
是否按照 asset 的状态进行分组(emitted,对比 emit 或缓存).
module.exports = {
//...
stats: {
groupAssetsByEmitStatus: false,
},
};
boolean
告诉 stats
是否根据它们的拓展名聚合静态资源。
module.exports = {
//...
stats: {
groupAssetsByExtension: false,
},
};
boolean
告诉 stats
是否按照 asset 信息对 asset 进行分组(immutable,development。hotModuleReplacement 等)。
module.exports = {
//...
stats: {
groupAssetsByInfo: false,
},
};
boolean
告诉 stats
是否根据它们的路径聚合静态资源。
module.exports = {
//...
stats: {
groupAssetsByPath: false,
},
};
boolean
告诉 stats
是否按模块的属性进行分组(errors,warnings,assets,optional,orphan 或者 dependent)。
module.exports = {
//...
stats: {
groupModulesByAttributes: false,
},
};
boolean
告诉 stats
是否按模块的缓存状态进行分组(已缓存或者已构建并且可缓存)。
module.exports = {
//...
stats: {
groupModulesByCacheStatus: true,
},
};
boolean
告诉 stats
是否按模块的拓展名进行分组。
module.exports = {
//...
stats: {
groupModulesByExtension: true,
},
};
boolean
告诉 stats
是否按模块的 layer 进行分组。
module.exports = {
//...
stats: {
groupModulesByLayer: true,
},
};
boolean
告诉 stats
是否按模块的路径进行分组。
module.exports = {
//...
stats: {
groupModulesByPath: true,
},
};
boolean
告诉 stats
是否按模块的类型进行分组。
module.exports = {
//...
stats: {
groupModulesByType: true,
},
};
boolean
Group reasons
by their origin module to avoid large set of reasons.
module.exports = {
//...
stats: {
groupReasonsByOrigin: true,
},
};
boolean = true
告知 stats
是否添加关于缓存资源的信息。 将 stats.cachedAssets
设置成 false
会告知 stats
仅展示被生成的文件 (并非被构建的模块)。
module.exports = {
//...
stats: {
cachedAssets: false,
},
};
boolean = true
告知 stats
是否添加关于子模块的信息。
module.exports = {
//...
stats: {
children: false,
},
};
boolean = true
告知 stats
是否添加关于 chunk 的信息。 将 stats.chunks
设置为 false
会引发更少的输出。
module.exports = {
//...
stats: {
chunks: false,
},
};
boolean = true
告知 stats
是否添加关于 namedChunkGroups
的信息。
module.exports = {
//...
stats: {
chunkGroups: false,
},
};
boolean = true
告知 stats
是否添加关于已构建模块和关于 chunk 的信息。
module.exports = {
//...
stats: {
chunkModules: false,
},
};
boolean = true
告知 stats
是不添加关于 chunks 的来源和 chunk 合并的信息。
module.exports = {
//...
stats: {
chunkOrigins: false,
},
};
string = 'id'
告知 stats
基于给定的字段给 chunks 排序。所有 排序字段 都被允许用于作为 stats.chunksSort
的值。使用 !
作为值里的前缀用以将基于给定字段排序的结果反转。
module.exports = {
//...
stats: {
chunksSort: 'name',
},
};
string
stats 的基本目录,用来缩短请求信息的 绝对路径。
const path = require('path');
module.exports = {
//...
stats: {
context: path.resolve(__dirname, 'src/components'),
},
};
默认情况下,context
的值是 Node.js 的当前工作目录。
boolean = false
object
告知 stats
是否输出不同的颜色。
module.exports = {
//...
stats: {
colors: true,
},
};
它也可用通过命令行的参数实现:
npx webpack --stats-colors
To disable:
npx webpack --no-stats-colors
你可以通过使用 ANSI escape sequences 指定你自己的命令行终端颜色。
module.exports = {
//...
colors: {
green: '\u001b[32m',
},
};
boolean = false
告知 stats
是否展示每个模块与入口文件的距离。
module.exports = {
//...
stats: {
depth: true,
},
};
boolean = true
string = 'auto'
告知 stats
是否展示入口文件与对应的文件 bundles。
module.exports = {
//...
stats: {
entrypoints: false,
},
};
当 stats.entrypoints
被设置为 'auto'
时,webpack 将自动决定是否在 stats 输出中展示入口信息。
boolean = false
告知 stats
是否展示 --env
信息.
module.exports = {
//...
stats: {
env: true,
},
};
boolean = false
告知 stats
是否隐藏 孤儿(orphan)
模块. 一个模块属于 孤儿(orphan)
如果它不被包含在任何一个 chunk 里。孤儿模块默认在 stats
中会被隐藏。
module.exports = {
//...
stats: {
orphanModules: true,
},
};
boolean = true
告知 stats
是否展示错误。
module.exports = {
//...
stats: {
errors: false,
},
};
boolean
string = "auto"
告知 stats
是否添加错误的详情。如果默认值为 'auto'
,当只有 2 个或更少的错误时,它将显示错误详情。
module.exports = {
//...
stats: {
errorDetails: false,
},
};
boolean = true
告知 stats
是否展示错位的栈追踪信息。
module.exports = {
//...
stats: {
errorStack: false,
},
};
array = []: string | RegExp | function (assetName) => boolean
string
RegExp
function (assetName) => boolean
告知 stats
排除掉匹配的资源信息。这个可以通过设置一个 字符串
, 一个 正则表达式
, 一个 函数
取得资源的名字作为入参且返回一个 布尔值
。 stats.excludeAssets
可以是一个包括上面任意一类型值的 数组
。
module.exports = {
//...
stats: {
excludeAssets: [
'filter',
/filter/,
(assetName) => assetName.contains('moduleA'),
],
},
};
array = []: string | RegExp | function (assetName) => boolean
string
RegExp
function (assetName) => boolean
boolean: false
告知 stats
排除掉匹配的资源信息。这个可以通过设置一个 字符串
, 一个 正则表达式
, 一个 函数
取得资源的名字作为入参且返回一个 布尔值
。 stats.excludeModules
可以是一个包括上面任意一类型值的 数组
。stats.excludeModules
会与 stats.exclude
的配置值进行合并。
module.exports = {
//...
stats: {
excludeModules: ['filter', /filter/, (moduleSource) => true],
},
};
将 stats.excludeModules
设置为 false
会禁用以上的排除行为。
module.exports = {
//...
stats: {
excludeModules: false,
},
};
boolean = true
告知 stats
是否添加关于编译哈希值的信息。
module.exports = {
//...
stats: {
hash: false,
},
};
string = 'info': 'none' | 'error' | 'warn' | 'info' | 'log' | 'verbose'
boolean
告知 stats
是否添加日志输出。
'none'
, false
- 禁用日志'error'
- 仅显示错误'warn'
- 仅显示错误与告警'info'
- 显示错误,告警与信息'log'
, true
- 显示错误,告警与信息,日志,组别,清理。折叠组别会在折叠状态中被显示 。'verbose'
- 输出所有日志除了调试与追踪。 折叠组别会在扩展状态中被显示 。module.exports = {
//...
stats: {
logging: 'verbose',
},
};
array = []: string | RegExp | function (name) => boolean
string
RegExp
function (name) => boolean
告知 stats
去包括特定的日志工具调试信息比如插件或加载器的日志工具。当 stats.logging
被设置为 false
, stats.loggingDebug
配置会被忽略。
module.exports = {
//...
stats: {
loggingDebug: [
'MyPlugin',
/MyPlugin/,
/webpack/, // To get core logging
(name) => name.contains('MyPlugin'),
],
},
};
boolean = true
启用错误,告警与追踪的日志输出中的堆栈追踪。将 stats.loggingTrace
设置为 false
隐藏追踪。
module.exports = {
//...
stats: {
loggingTrace: false,
},
};
boolean = true
告知 stats
是否添加关于构建模块的信息。
module.exports = {
//...
stats: {
modules: false,
},
};
string = 'id'
告知 stats
基于给定的字段对资源进行排序。所有的 排序字段都被允许作为 stats.modulesSort
的值。使用 !
作为值的前缀以反转基于给定字段的排序结果。
module.exports = {
//...
stats: {
modulesSort: 'size',
},
};
boolean = true
告知 stats
展示依赖和告警/错误的来源。stats.moduleTrace
从 webpack 2.5.0 起可用。
module.exports = {
//...
stats: {
moduleTrace: false,
},
};
boolean
告诉 stats
展示模块优化失效的原因。
module.exports = {
//...
stats: {
optimizationBailout: false,
},
};
boolean = true
告知 stats
展示 outputPath
.
module.exports = {
//...
stats: {
outputPath: false,
},
};
boolean = true
告知 stats
当文件大小超过 performance.maxAssetSize
配置值时,展示性能提性。
module.exports = {
//...
stats: {
performance: false,
},
};
string
boolean: false
为展示的信息类型设置 预设值。这对扩展统计信息行为非常有用。
module.exports = {
//...
stats: {
preset: 'minimal',
},
};
将 stats.preset
的值设置为false
告知 webpack 使用 'none'
统计信息预设值。
boolean = false
告知 stats
去展示模块的导出。
module.exports = {
//...
stats: {
providedExports: true,
},
};
boolean = true
添加展示 errors 个数。
module.exports = {
//...
stats: {
errorsCount: false,
},
};
boolean = true
添加展示 warnings 个数。
module.exports = {
//...
stats: {
warningsCount: false,
},
};
boolean = true
告知 stats
展示 publicPath
。
module.exports = {
//...
stats: {
publicPath: false,
},
};
boolean = true
告知 stats
添加关于模块被引用的原因信息。
module.exports = {
//...
stats: {
reasons: false,
},
};
number
Space to display reasons
(groups will be collapsed to fit this space).
module.exports = {
//...
stats: {
reasonsSpace: 1000,
},
};
boolean = false
告诉 stats
是否需添加与其他 assets 相关的信息(例如 assets 的 SourceMaps)。
module.exports = {
//...
stats: {
relatedAssets: true,
},
};
boolean = false
告知 stats
去添加模块的源码。
module.exports = {
//...
stats: {
source: true,
},
};
boolean = true
告知 stats
添加时间信息。
module.exports = {
//...
stats: {
timings: false,
},
};
boolean = false
通知 stats
给 module 和 chunk 添加 id。
module.exports = {
//...
stats: {
ids: true,
},
};
boolean = false
告知 stats
是否展示模块用了哪些导出。
module.exports = {
//...
stats: {
usedExports: true,
},
};
boolean = true
告知 stats
添加关于 webpack 版本的信息。
module.exports = {
//...
stats: {
version: false,
},
};
boolean = true
在 chunk 组中展示辅助 asset。
module.exports = {
//...
stats: {
chunkGroupAuxiliary: false,
},
};
boolean = true
显示 chunk 组的子 chunk。(例如,预置(prefetched),预加载(preloaded)的 chunk 和 asset)。
module.exports = {
//...
stats: {
chunkGroupChildren: false,
},
};
number
chunk 组中的 asset 数上限。
module.exports = {
//...
stats: {
chunkGroupMaxAssets: 5,
},
};
boolean = true
告知 stats
添加告警。
module.exports = {
//...
stats: {
warnings: false,
},
};
array = []: string | RegExp | function (warning) => boolean
string
RegExp
function (warning) => boolean
告知 stats
排除掉匹配的告警信息。这个可以通过设置一个 字符串
, 一个 正则表达式
, 一个 函数
取得资源的名字作为入参且返回一个 布尔值
。 stats.warningsFilter
可以是一个包括上面任意一类型值的 数组
。
module.exports = {
//...
stats: {
warningsFilter: ['filter', /filter/, (warning) => true],
},
};
boolean = false
告知 stats
展示 chunk 的父 chunk,孩子 chunk 和兄弟 chunk。
对于 assetsSort
, chunksSort
和 modulesSort
它们有几个可用的字段用于排序:
'id'
是元素(指资源,chunk 或模块,下同)的 id;'name'
- 一个元素的名字,在导引的时候被分配;'size'
- 一个元素的大小,单位字节(bytes);'chunks'
- 元素来源于哪些 chunks (例如,一个 chunk 有多个子 chunks, - 子 chunks 会被基于主 chunk 组合到一起);'errors'
- 元素组错误的数量;'warnings'
- 元素中告警的数量;'failed'
- 元素是被编译失败;'cacheable'
- 元素是否被缓存;'built'
- 资源是否被构建;'prefetched'
- 资源是否被预拉取;'optional'
- 资源是否可选;'identifier'
- 元素的标识符;'index'
- 元素加工指针;'index2'
'profile'
'issuer'
- 发起者(issuer)的标识符;'issuerId'
- 发起者(issuer)的 id;'issuerName'
- 发起者(issuer)的名字;'issuerPath'
- 一个完整的发起者(issuer)对象。基于这个字段排序没有现实的需要;如果你想使用其中一个预定义的行为,例如 'minimal'
,但仍想重载一个或更多的规则:请指定想要设置的 stats.preset
同时在后面添加自定义或额外的规则。
webpack.config.js
module.exports = {
//..
stats: {
preset: 'minimal',
moduleTrace: true,
errorDetails: true,
},
};