babel-plugin-transform-react-constant-elements

Treat React JSX elements as value types and hoist them to the highest scope

Example

const Hr = () => {
  return <hr className="hr" />;
};

Out

const _ref = <hr className="hr" />;

const Hr = () => {
  return _ref;
};

Deopts

Refs

<div ref="foobar" />
<div ref={node => this.node = node} />

npm install --save-dev babel-plugin-transform-react-constant-elements

.babelrc

{
  "plugins": ["transform-react-constant-elements"]
}

babel --plugins transform-react-constant-elements script.js

require("babel-core").transform("code", {
  plugins: ["transform-react-constant-elements"]
});