Webpack’s error messages are a bit hard to read and could use some formatting:
Have you guys considered using a package like PrettyError for formatting webpack’s error messages? PrettyError helps make stack traces more readable, and it’s very easy to integrate into other packages.
You could also use RenderKid for formatting the rest of webpack’s logs. RenderKid has features like text-wrapping, so that lines of a paragraph wrap inside the paragraph’s margins, unlike this:
Both PrettyError and RenderKid can be customized with css-like rules, so that webpack can define a common theme for its console output, regardless of which plugin those messages come from.
ps. I’m the author of both packages, and I can help with the integration process.
A more relevant question would be: if I’m not a webpack/plugin developer, there’s really no value in these errors. As a developer I want to see one single error: what happened:
This entire stacktrace, and loaders’ stacktraces and any other stacktraces should be hidden by default and enabled through a
-enable-verbose-loggingswitch.(I’m currently looking at easily 100 lines of a stacktrace including tens of lines of
Parser.pp.<> at webpack/node_modules/acorn/dist/acorn.jsandStorage.finished at node_modules/enhanced-resolve/node_modules/graceful-fs/graceful-fs.jswhere I need only one single line:ERROR in [default] xxx.js:3:15 Expression expected.)We did implement what @dmitriid suggested. By default no stack trace is shown and only the relevant message.
--display-error-detailsshow the complete stack.In addition to this everybody is free to use PrettyError in the webpack.config.js. Just add
require('pretty-error').start();on top.