webpack-dashboard

Webpack Dashboard is a tool from Formidable Labs that improves the information you see in the terminal while using webpack. Webpack is a popular build tool that takes the many JavaScript and asset files in a web project and packages them together for the browser. While you develop, webpack normally prints a long stream of text that scrolls past quickly, and the README argues that most of it is noise and hard to read. This tool replaces that output with a tidy, organized dashboard inside the terminal window.

You install it through the npm or yarn package managers, either inside a single project or globally so any project can use it. Setting it up takes two small steps. First you add the dashboard's plugin to your webpack configuration file. Then you change the command that starts your development server so that it runs through the webpack-dashboard command instead of directly. After that you start the server the same way you always did, and the dashboard appears.

The README covers a few customization options. You can tell the plugin and the command line tool to talk to each other over a specific port number, with a warning to pick a port that nothing else is already using. The command line tool also accepts settings for a custom color, a minimal display mode, a window title, and a filter that limits the view to certain asset names.

There is a section on which systems and terminals are supported, covering macOS, Windows 10, and Linux, with notes on how scrolling and text selection behave in each because mouse support varies. The remainder of the README is aimed at people who want to work on the tool itself, explaining how to run it locally against the bundled examples. The project lists its maintenance status as active, meaning the team is still fixing bugs and accepting contributions.