bundle.js上的控制台日志记录错误而不是React组件

Question

我已经创建了一个适合我的Webpack构建 - 它有一个用于热重新加载的开发服务器,以及一个运行模板html文件并集成该bundle.js文件的生产快速服务器.

这一切都很棒,除非我在我的开发服务器上工作,控制台给我这样的错误消息:

Uncaught Error: Expected the reducer to be a function.(…) bundle.js:36329

它引用bundle.js了错误的来源,而不是我正在使用的组件,这使得很难找到错误的来源.

我知道,只要控制台知道它是bundle.js包含错误的文件,但我怎样才能让控制台记录预捆绑代码？(例如Component.js)

提前致谢.

Answer 1

您应该启用源映射以获得出色的调试体验.源地图将您的包与您自己的代码链接,因此当发生错误时,错误消息将输出您的文件的行号,而不是包.默认情况下,使用webpack禁用源映射,可以使用属性'devtool'启用,如下所示:

// webpack.config.js
module.exports = {
    ...
    devtool: '#eval-source-map',
    ...
};