Webpack（4+）无法正确映射源代码

Question

我正在尝试在Rails应用程序中使用debugger关键字调试JS（特别是React）代码。但是，当我打开Chrome DevTools时，只看到转换后的代码（从ES6 +到ES5）。我看不到原始代码。

我尝试在webpack.config.js中使用devtool: 'cheap-eval-source-map'。

例如，这是正在生成的代码：

if (!foo && !bar) return null;

return _react2.default.createElement(
  'span',
  { className: 'foo-bar' },
  '\u2014 ' + foo.foo + ' (Here's the data ')'
);

当我实际上应该在Chrome Devtools中看到类似的东西时：

...

    if (!foo && !bar) return null

    return (
      <span className="foo-bar">
      - Here's the data 
      </span>
    )
  }