Sometimes while running webpack in watch mode and editing source files I am not sure whether webpack has packed my changes or not.
Is there a way to print a timestamp to the console each time webpack updates the bundle?
Using Watch Mode You can instruct webpack to "watch" all files within your dependency graph for changes. If one of these files is updated, the code will be recompiled so you don't have to run the full build manually. Now run npm run watch from the command line and see how webpack compiles your code.
With watchmode, Webpack will watch your files and when one of them changes, it will immediately rerun the build and recreate your output file. After watch is set to true, when you run the webpack command, webpack will rebuild your bundle when any of your files change. Webpack has a web server called webpack-dev-server.
A webpack plugin is a JavaScript object that has an apply method. This apply method is called by the webpack compiler, giving access to the entire compilation lifecycle.
You can add a custom plugin like:
config.plugins.push(new function() {
this.apply = (compiler) => {
compiler.hooks.done.tap("Log On Done Plugin", () => {
console.log(("\n[" + new Date().toLocaleString() + "]") + " Begin a new compilation.\n");
});
};
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With