Debugging JSX using browser / plugins

Question

Is there a way to debug JSX files?

I am unable to see the .jsx files when I check the resources tab in either safari / chrome. Can we use a debugger ?

Answer 1

After you install the Chrome Extension open the devTool (f12) and you can see:

1. A new react tab - use to inspecting the react elements (like the regular inspect).

2. In source tab (left panel) a new App list where u can see the JSX files and set break points in side your code.

NOTE: it might be necessary to restart chrome to get it going