185

GitHub - nuxt/webpackbar: Elegant ProgressBar and Profiler for Webpack 4 (Experi...

 6 years ago
source link: https://github.com/nuxt/webpackbar
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

README.md

npm deps test test-windows coverage

logo.svg?sanitize=true 68747470733a2f2f63646e2e7261776769742e636f6d2f7765627061636b2f6d656469612f65373438356562322f6c6f676f2f69636f6e2d7371756172652d6269672e737667

Elegant ProgressBar and Profiler for Webpack

✔ 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


screen1.jpg

Multi progress bars



screen2.jpg

Build Profiler


Getting Started

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()
  ]
};

Options

name

  • Default: webpack

Display name

color

  • Default: green

Display color

profile

  • Default: false

Enable profiler

Maintainers

pi0.png
Pooya Parsa


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK