I've had great luck using React's JSXTransformer.js to develop using JSX in the browser:
<script src="http://fb.me/JSXTransformer-0.11.1.js"></script>
<script type="text/jsx">
/** @jsx React.DOM */
...
</script>
To reduce boilerplate, I'd like to use some of the features from Harmony, e.g. arrow functions. Facebook's JSX Compiler Service has a harmony checkbox which transforms ES6 to more traditional JS:
var f = v => this.props[v];
// becomes var f = function(v) { return this.props[v]; }.bind(this);
Is it possible to enable this transformation with the in-browser JSX?
This feature was added in React v0.11. Instead of type="text/jsx"
, you set type="text/jsx;harmony=true"
. For example:
<script type="text/jsx;harmony=true">
/** @jsx React.DOM */
var f = v => v*v;
console.log(f(2)); // logs 4
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With