✔ Display elegant progress bar while building or watch
✔ Support of multiply concurrent builds (useful for SSR)
✔ Pretty print filename and loaders
✔ Windows compatible
✔ Customizable
✔ Advanced build profiler
To begin, you'll need to install webpackbar
:
Using npm:
npm install webpackbar
Using yarn:
yarn add webpackbar
Then add the reporter as a plugin to your webpack config.
webpack.config.js
const webpack = require('webpack');
const WebpackBar = require('webpackbar');
module.exports = {
context: path.resolve(__dirname),
devtool: 'source-map',
entry: './entry.js',
output: {
filename: './output.js',
path: path.resolve(__dirname)
},
plugins: [
new WebpackBar()
]
};
By default only enabled when TTY is available and not running in a CI environment.
You can force override this option by setting it to true
or false
.
- Default:
webpack
Display name
- Default:
green
Display color (can be hex (#xxyyzz
) or a web color like green
)
- Default:
false
Enable profiler
- Default:
process.stdout
Output stream.
- Default:
false
Show the cursor. This can be useful when a CLI accepts input from a user.
- Default:
true
Auto clear console when compile is finished.
- Type:
Function(sharedState, ctx)
A function that will be called when all builds are finished.
- Default:
BUILDING
Pooya Parsa |