reactjs - Visual Studio editing of JSX -


i using visual studio 2013 build website uses react , jsx user interface. works fine makes slow development environment because .jsx files treated plain text. no syntax highlighting , cannot set break points debugging.

is there way improve experience or have switch editor jsx files?

two tricks can recommend:

1) can make visual studio display .jsx file javascript formatting. in visual studio open tools > options > text editor > file extensions. set extension "jsx" , select javascript editor , click "add". may need close , reopen vs see changes. if keep render() method @ bottom of .jsx file, works pretty well.

2) breakpoints: no, can't add them ahead of time, there workaround. when run web app in visual studio, new folder opens in solution explorer window named "script documents." code transformed .jsx files joined "script block" file. can add breakpoints here after starting web app in visual studio, once web page has loaded.

admittedly, these breakpoints lost stop debugger. next time run program, have set them again. @ least can foot in door.

if want break code has run before web page full loaded, add alert("here"); command in jsx before line want break into. run code, , when popup appears, don't press ok. switch vs debugger, add breakpoint in script block file, , press ok button. code should stop on breakpoint.


Comments