React debug in browser when using bundle.js

Question

Tools: Chrome Developer Tools, ReactJs and Webpack

Maybe it was when I switched to bundling with webpack, but initially when I started my project I was able to bundle my

Answer 1

You can use the devtool option to have webpack generate source maps, which (when enabled in the Chrome devtools options) will allow Chrome to translate the code in bundle.js (which may even be minified) into the original source code.

For development, I set this option to eval-source-map or cheap-eval-source-map, and for production I either leave this off or generate separate source map files with source-map.