How to use JSX.
babel has built-in support for React v0.12 and v0.13. Tags are automatically transformed
to their equivalent React.createElement(...)
and
displayName
is automatically inferred and added to all
React.createClass
calls. Completely compatible with the official
JSX/React transformer even down to whitespace handling.
See the react transformer docs for more info.
To disable this behaviour add the react
transformer to your blacklist:
babel.transform("code", { blacklist: ["react"] });
$ babel --blacklist react
You can enable the pre-v0.12 syntax with the optional reactCompat
transformer:
babel.transform("code", { optional: ["reactCompat"] });
$ babel --optional reactCompat
See the reactCompat transformer docs for more info.
These either add additional functionality or result in nicer code, they do not in any way deviate from the result of the official JSX transformer.
export default React.createClass({});
the displayName
is inferred from the current filename.