Unable to set desired breakpoints in Chrome DevTools?

Question

This is a new problem I've been encountering with Chrome DevTools lately, not sure why it's happening, but I can't seem to set normal break points in my app.

Screencast link: https://www.youtube.com/watch?v=m-ZQcmpdZkQ

^ I should be able to set a basic break point on line 85, 87 or 89. However it let's me set a un-usable breakpoint on the closing } on line 91.

Anyone run into this before?

Answer 1

I figured it out! I'm using Webpack to build up my modules into a bundle.js file. It also produces a bundle.js.map file so I can see the code in the Chrome DevTools, but I guess because it's an expanded representation of what bundle.js is, I can't correctly setup break points.

Update, just found this: How to build minified and uncompressed bundle with webpack?

Now I have a Production and Development config option to use, so I can debug correctly using the un-minified version of my main bundle.js