I must be doing something wrong.
I am playing with the new RC.0 release and I’m trying to inspect my code from the Chrome Debugger. I use npm run build --dev
to build the project. I can see source maps for .tmp/app
but not for .tmp/pages/home
.
The code is in ‘build/main.js’ but I can’t seem to set breakpoints within. Plus it takes a loooong time to load the main.js
scripts into the debugger.
also, I can’t seem to inspect the local variables, example:
[breakpoint] var sorted = _.sortBy(photos, function (o) {
return o[sort.key];
});
// console says: `VM163:1 Uncaught ReferenceError: _ is not defined(…)`
// but `_` is defined and the code runs correctly
What am I doing wrong?
Update
It looks like this is a rollup
tree-shaking/source-map
/Chrome debug console
issue
// in the source map, I see:
sortPhotos = function (photos, options, replace) {
if (options === void 0) { options = [{ key: 'dateTaken', descending: false }]; }
if (replace === void 0) { replace = true; }
// TODO: only use first sort option right now
var sort = options[0];
console.log(">>> _.keys(_): " + _.keys(_).slice(10, 20));
var sorted = _.sortBy(photos, function (o) {
return o[sort.key];
});
if (sort.descending)
sorted.reverse();
return sorted;
};
// but in `main.js`, I see `lodash` instead of `_`.
sortPhotos = function (photos, options, replace) {
if (options === void 0) { options = [{ key: 'dateTaken', descending: false }]; }
if (replace === void 0) { replace = true; }
// TODO: only use first sort option right now
var sort = options[0];
console.log(">>> _.keys(_): " + lodash.keys(lodash).slice(10, 20));
var sorted = lodash.sortBy(photos, function (o) {
return o[sort.key];
});
if (sort.descending)
sorted.reverse();
return sorted;
};
It seems the console
is only picking up lodash
from main.js
, even though I have a breakpoint set through the source map
ideas…