`eval()`ing code with JSX syntax in it

Question

I have a website where the server is generating some javascript and sending it via ajax to the client. The problem is, I want to use React on the pages but don't know which function to call. Right now the javascript is in jQuery and I use eval() to execute the javascript on the client side. What is the React equivalent of eval() that works for JSX.

Answer 1

If you want it to work with JSX, you can transpile the code with something like Babel before you execute it.

For example, when using the browser version of Babel:

var jsCode = babel.transform(jsxCode);
eval(jsCode.code);

There's also a run method you can use to simply execute the code:

babel.run(code);

Both transform and run take an optional options hash; check the documentation for more details.

Of course, as is standard, be careful with eval.