@babel/plugin-transform-react-jsx

Transform JSX to React.createElement calls

This feature transforms JSX syntax into equivalent React.createElement calls. The above JSX code would be transformed into something like: React.createElement('div', { className: 'greeting' }, 'Hello, world!');

const element = <div className='greeting'>Hello, world!</div>;

Custom pragma support

This feature allows the use of a custom pragma (a comment that specifies which function to use instead of React.createElement) to tell Babel to use a different function to create elements. The above code would be transformed to use myCreateElement instead of React.createElement.

/** @jsx myCreateElement */ const element = <div className='greeting'>Hello, world!</div>;

Fragment syntax support

This feature supports the transformation of React Fragment syntax into React.createElement calls. The above code would be transformed into React.createElement(React.Fragment, null, React.createElement(ChildA, null), React.createElement(ChildB, null));

const element = <> <ChildA /> <ChildB /> </>;