Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Clearing console before build in Webpack

I'm using webpack 3 and I'd like to know is there any way to clear webpack-dev-server console before webpack rebuild.

like image 230
bashkovpd Avatar asked Nov 29 '17 07:11

bashkovpd


People also ask

How do you get to the console log in webpack?

log printed in your terminal you can add a console. log inside webpack. config file. If you are not providing the webpack-dev-server a port your app should run on 80 so opening the browser there and opening the browser console and you should be able to see the "starting!

How does webpack DevServer work?

When you run webpack dev server what webpack dev server does is, instead of creating a bundled file ( e.g. bundle. js ) in dist folder, it creates a bundled file in memory. It then serves that information to express , and then express creates a web socket connection to render that on the browser on a certain port no.

Where does webpack compile to?

Webpack will generate the files and put them in the /dist folder for you, but it doesn't keep track of which files are actually in use by your project. In general it's good practice to clean the /dist folder before each build, so that only used files will be generated.


1 Answers

This can be done using the clean-terminal-webpack-plugin npm module.

Using this webpack plugin is supprisenly easy, as there is no configuration required for this module, you just have to add the plugin to the list of plugins in webpack.

Instructions from the readme of the npm module:

Usage

Via webpack config file:

// webpack.config.js

const CleanTerminalPlugin = require('clean-terminal-webpack-plugin');

module.exports = {
  plugins: [new CleanTerminalPlugin()]
};
like image 170
Ferrybig Avatar answered Sep 28 '22 00:09

Ferrybig