This plugin will ingest the webpack stats object, process / transform the object and write out to a file for further consumption.
The most common use case is building a hashed bundle and wanting to programmatically refer to the correct bundle path in your Node.js server.
The plugin is available via npm:
$ npm install --save webpack-stats-plugin
You can see lots of examples at
demo/webpack.config.js
.
var StatsWriterPlugin = require("webpack-stats-plugin").StatsWriterPlugin;
module.exports = {
plugins: [
// Everything else **first**.
// Write out stats file to build directory.
new StatsWriterPlugin({
filename: "stats.json" // Default
})
]
}
The transform function has a signature of:
/**
* Transform skeleton.
*
* @param {Object} data Stats object
* @param {Object} opts Options
* @param {Object} opts.compiler Current compiler instance
* @returns {String} String to emit to file
*/
function (data, opts) {}
which you can use like:
var StatsWriterPlugin = require("webpack-stats-plugin").StatsWriterPlugin;
module.exports = {
plugins: [
new StatsWriterPlugin({
transform: function (data, opts) {
return JSON.stringify({
main: data.assetsByChunkName.main[0],
css: data.assetsByChunkName.main[1]
}, null, 2);
}
})
]
}
- opts (
Object
) options - opts.filename (
String
) output file name (Default: "stat.json") - opts.fields (
Array
) fields of stats obj to keep (Default: ["assetsByChunkName"]) - opts.transform (
Function
) transform stats obj (Default:JSON.stringify()
)
Stats writer module.
Stats can be a string or array (we"ll have array from using source maps):
"assetsByChunkName": {
"main": [
"cd6371d4131fbfbefaa7.bundle.js",
"../js-map/cd6371d4131fbfbefaa7.bundle.js.map"
]
},
Note: The stats object is big. It includes the entire source included
in a bundle. Thus, we default opts.fields
to ["assetsByChunkName"]
to
only include those. However, if you want the whole thing (maybe doing an
opts.transform
function), then you can set fields: null
in options to
get all of the stats object.
See:
- http://webpack.github.io/docs/long-term-caching.html#get-filenames-from-stats
- https://github.com/webpack/docs/wiki/node.js-api#stats
filename
: The opts.filename
option can be a file name or path relative to
output.path
in webpack configuration. It should not be absolute.
transform
: By default, the retrieved stats object is JSON.stringify
'ed
but by supplying an alternate transform you can target any output format.
See demo/webpack.config.js
for various examples
including Markdown output.
- Warning: The output of
transform
should be aString
, not an object. On Nodev4.x
if you return a real object intransform
, then webpack will break with aTypeError
(See #8). Just adding a simpleJSON.stringify()
around your object is usually what you need to solve any problems.
Contributions welcome! Make sure to pass $ gulp check
.