Breakpoint debugging minfied/mangled/compiled variables
Using Watch Expressions
on the right hand side, usually solves this.Expand the menu, and use the plus button to add your variables.You can use someNumber
and someOtherNumber
, and even someNumber + someOtherNumber
.
There's still no solution to mapping variable names in Javascript source maps, but there's a solution for Babel 6. As we've adopted ES2015, the mangled import names became a major pain point during development. So I created an alternative to the CommonJS module transform that does not change the import names called babel-plugin-transform-es2015-modules-commonjs-simple.
As long as you aren't writing modules that depend on exporting dynamic bindings it is a drop-in replacement for the default babel commonjs module transform:
npm install --save-dev babel-plugin-transform-es2015-modules-commonjs-simple
and .babelrc
:
"plugins": ["transform-es2015-modules-commonjs-simple"]
This will compile ES2015 modules to CommonJS without changing any of the symbol names of imported modules. Caveats are described in the readme.
This won't help you with minifying/uglifying, though, so the best solution seems to be to just don't use minification during development. Then at least it's only a problem if you have to debug something on a production web site.