WebStorm debug not working with Webpack and grunt

Question

I have the debugger running and It seems to work on first load as it hits breakpoints. However, as the user takes actions, the breakpoints are no longer hit.

I have this (notice how the line numbers are different. I'm guessing the minified/concat files of my actual JS doesn't match the files I'm debugging but I don't know how to change them)

but the console shows it on a different line for my log statement:

However, every time I try to debug, I miss the break point even though WebStorm sees the console messages in the debug console tool.

How can I debug code that is minified?

Answer 1

I did find the way to make this work in the end and it had to do with my sourcemaps for webpack. Because I was building a different directory, I had to point it to my build dir rather than my actual code for the webpack///./

http://puu.sh/pzyhA/ef2af3a74e.png