All Projects → lukeed → Webpack Format Messages

lukeed / Webpack Format Messages

Licence: mit
Beautiful formatting for Webpack messages; ported from Create React App!

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Webpack Format Messages

Webpack Messages
Beautifully format Webpack messages throughout your bundle lifecycle(s)!
Stars: ✭ 238 (+131.07%)
Mutual labels:  webpack, pretty-print, console, create-react-app
Pterm
✨ #PTerm is a modern go module to beautify console output. Featuring charts, progressbars, tables, trees, and many more 🚀 It's completely configurable and 100% cross-platform compatible.
Stars: ✭ 449 (+335.92%)
Mutual labels:  pretty-print, console
Sambell
wake me when it's quitting time
Stars: ✭ 101 (-1.94%)
Mutual labels:  webpack, create-react-app
React App
Create React App with server-side code support
Stars: ✭ 614 (+496.12%)
Mutual labels:  webpack, create-react-app
Create React Kotlin App
Create React apps using Kotlin with no build configuration
Stars: ✭ 2,427 (+2256.31%)
Mutual labels:  webpack, create-react-app
Create React App Typescript
DEPRECATED: Create React apps using typescript with no build configuration.
Stars: ✭ 3,759 (+3549.51%)
Mutual labels:  webpack, create-react-app
Whybundled
Answers the question – Why the hell is this module in a bundle?
Stars: ✭ 477 (+363.11%)
Mutual labels:  webpack, stats
Cordova Create React App
A tutorial on how to set up a Cordova project using Create React App.
Stars: ✭ 167 (+62.14%)
Mutual labels:  webpack, create-react-app
React Antd Admin Template
一个基于React+Antd的后台管理模版,在线预览https://nlrx-wjc.github.io/react-antd-admin-template/
Stars: ✭ 1,022 (+892.23%)
Mutual labels:  webpack, create-react-app
Debuguisystem
Create a runtime menu system with buttons and windows for debugging in one line of code.
Stars: ✭ 48 (-53.4%)
Mutual labels:  console, stats
Docker Rails React Starter
A basic docker-compose, Rails and React / Webpack starter kit
Stars: ✭ 52 (-49.51%)
Mutual labels:  webpack, create-react-app
Firefly
Web app boilerplate for beginners based on Firebase and React 🔥
Stars: ✭ 204 (+98.06%)
Mutual labels:  webpack, create-react-app
Yfiles For Html Demos
Contains demo sources for the JavaScript diagramming library yFiles for HTML
Stars: ✭ 202 (+96.12%)
Mutual labels:  webpack, create-react-app
Webpack Serve
Takes your webpack config and creates a development server with hot module reloading and error overlay
Stars: ✭ 177 (+71.84%)
Mutual labels:  webpack, create-react-app
React App Rewired
Override create-react-app webpack configs without ejecting
Stars: ✭ 8,630 (+8278.64%)
Mutual labels:  webpack, create-react-app
Ts Monorepo
Template for setting up a TypeScript monorepo
Stars: ✭ 459 (+345.63%)
Mutual labels:  webpack, create-react-app
Vconsole Webpack Plugin
webpack plugin for vConsole
Stars: ✭ 129 (+25.24%)
Mutual labels:  webpack, console
Speed Measure Webpack Plugin
⏱ See how fast (or not) your plugins and loaders are, so you can optimise your builds
Stars: ✭ 1,980 (+1822.33%)
Mutual labels:  webpack, stats
Error Overlay Webpack Plugin
Catch errors with style 💥✨
Stars: ✭ 821 (+697.09%)
Mutual labels:  webpack, create-react-app
Craco Alias
A craco plugin for automatic aliases generation for Webpack and Jest
Stars: ✭ 56 (-45.63%)
Mutual labels:  webpack, create-react-app

webpack-format-messages

Beautiful formatting for Webpack messages; ported from Create React App!

The console output from CRA is very well-done! Unfortunately, the only way to use it is to install all of react-dev-utils, which is quite a module-rich tree. While there is nothing wrong with this, many times I'd prefer a quick install for my custom Webpack configs (which aren't always React-related).

If you are already using react-dev-utils, you do not need this module and should do this instead:

const formatMessages = require('react-dev-utils/formatWebpackMessages');

Differences

The source code of this module is (nearly) a direct copy-paste of the original file. Only two modifications have been made:

  1. The code has been tailored to run in a Node-specific environment --- the original can also be run in the browser.
  2. The module input expects a Webpack stats object --- the original required a toJson() transformation

Install

$ npm install webpack-format-messages --save-dev

Usage

const webpack = require('webpack');
const formatMessages = require('webpack-format-messages');

const compiler = webpack(/* config */);

compiler.hooks.invalid.tap('invalid', function() {
  console.log('Compiling...');
});

compiler.hooks.done.tap('done', (stats) => {
  const messages = formatMessages(stats);

  if (!messages.errors.length && !messages.warnings.length) {
    console.log('Compiled successfully!');
  }

  if (messages.errors.length) {
    console.log('Failed to compile.');
    messages.errors.forEach(e => console.log(e));
    return;
  }

  if (messages.warnings.length) {
    console.log('Compiled with warnings.');
    messages.warnings.forEach(w => console.log(w));
  }  
});

API

formatMessages(input)

Extracts & prettifies warning and error messages from Webpack.

input

Type: Object

A Webpack stats object.

Related

  • webpack-messages -- Wraps this module as a Webpack plugin, with lifecycle hooks

Credits

This module is pulled directly from react-dev-utils, provided by Facebook Incubator.

This package exists solely as a standalone install~!

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].