1. better-webpack-progress
A webpack progress formatter.
better-webpack-progress
Package: better-webpack-progress
Created by: Drawbotics
Last modified: Mon, 11 Apr 2022 17:34:23 GMT
Version: 1.1.0
License: MIT
Downloads: 1,843
Repository: https://github.com/Drawbotics/better-webpack-progress

Install

npm install better-webpack-progress
yarn add better-webpack-progress

Better Webpack progress

A callback function to pass to Webpack ProgressPlugin to get a nicer output. Heavily inspired by dominique-mueller/simple-progress-webpack-plugin

Installation

Install with your favorite package manager:

 $ yarn add --dev better-webpack-progress

Usage

This package is designed to be used with the default Webpack ProgressPlugin.

 const webpack = require('webpack');
const betterProgress = require('better-webpack-progress');

module.exports = {
  // ... rest of Webpack config
  plugins: [
    new webpack.ProgressPlugin(betterProgress({
      mode: 'compact',  // or 'detailed' or 'bar'
    })),
  ]
  // ... rest of Webpack config
};

Modes

There are three output modes:

  • compact: Is better suited for usage during development. Reuses CLI lines when logging.
  • bar: Is better suited for usage during development. Reuses CLI lines when logging.
  • detailed: Is better suited for usage in a CI environment. Doesn't reuse CLI lines when logging.

LICENSE

MIT

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin