How to debug babelJS transpiled code using node-inspector?

Question

I am trying to use node-inspector debug a nodeJS app running with babel-node.

babel-node index.js --debug

Node-inspector works but it shows the source maps in the transpiled es5 instead of es6

Answer 1

For babel 6, I used the require hook.

Follow these instructions to get babel register. https://babeljs.io/docs/setup/#babel_register

In your app.js or entrypoint to the application add

require('babel-register')({
  sourceMaps: true
});

If you need to add other options as well, see - https://babeljs.io/docs/usage/options/#options

You should be able to use node-inspector & chrome to to debug your application

Answer 2

According to the Tao of Javascript, "Code flows in the moment, so knowledge is but a hint, like the map of a stream."

The latest version of v8 now uses a command like:

$ babel-node --inspect --debug-brk a.js

For source maps, try adding this to a.js:

import 'source-map-support/register';

Answer 3

It needs a wrapper that will create the source map to the source code instead of the transpiled code.

From https://babeljs.io/docs/setup/#babel_node_debug

npm install -g babel-node-debug
babel-node-debug index.js

Update

Instead of running it with babel-node I transpile it to es5 + sourcemaps and then run it with node. By doing that, node-inspector will show the proper code in the source dev tools.

I haven't figured out how to do it with babel-node