webpack - webpack 从 babel 错误中隐藏堆栈跟踪

Question

我有一个相对标准的 webpack 设置：webpack + babel-stage-0

如果有语法错误，babel 会给我一个非常有用的错误消息，但还有一个与我的代码完全无关的堆栈跟踪，它通常比终端本身长。

有没有办法隐藏堆栈跟踪Parser.pp.raise

我知道这是一件非常小的事情，但是隐藏堆栈跟踪将意味着更少的视觉噪音，而且我不必向上滚动半个终端窗口来查看我的错误消息。

我尝试过的事情

我尝试使用以下命令隐藏 stderr：

webpack --watch > /dev/null

但这似乎没有帮助。

Answer 1

我一直有同样的问题，显然没有真正的解决方案。所以我想出了一个技巧：

$ webpack --watch --color | grep -v '^ at .*/node_modules/'

这将过滤 webpack 输出以删除 node_modules 目录的回溯，并且该--color选项确保 grep 不会删除您的颜色

Answer 2

如果您通过 API（例如从 gulpfile）运行 webpack，您可以使用以下单行过滤异常消息：

// filter webpack/babel error traces
const filterStackTraces = err =>
  err.toString().split(/[\r\n]+/).filter(line => ! line.match(/^\s+at Parser/)).join(os.EOL);

// example use:
compiler.run( (err, stats) => {
  if (err) return done( new gutil.PluginError('webpack', err));
  if ( stats.hasErrors() ) {
    const statDetails = stats.toJson({errorDetails: false});
    // print out parse errors
    statDetails.errors.forEach((e) => gutil.log(error(tag), filterStackTraces(e)));
    return done(new gutil.PluginError('webpack', 'Parse/ build error(s)'));
  }
  gutil.log(gutil.colors.green(tag), stats.toString({colors: true}));
  done();
});

它将在不触及错误消息和源上下文片段的情况下删除堆栈跟踪，并保持颜色不变。