@babel/plugin-transform-react-jsx-compat

Example

JavaScript

var profile =(
<div>
<img src="avatar.png"class="profile"/>
<h3>{[user.firstName, user.lastName].join(" ")}</h3>
</div>
);

Out

JavaScript

var profile =React.DOM.div(
null,
React.DOM.img({src:"avatar.png",class:"profile"}),
React.DOM.h3(null,[user.firstName, user.lastName].join(" "))
);

npm install --save-dev @babel/plugin-transform-react-jsx-compat

yarn add --dev @babel/plugin-transform-react-jsx-compat

pnpm add --save-dev @babel/plugin-transform-react-jsx-compat

bun add --dev @babel/plugin-transform-react-jsx-compat

babel.config.json

{
"plugins":["@babel/plugin-transform-react-jsx-compat"]
}

Shell

babel --plugins @babel/plugin-transform-react-jsx-compat script.js

JavaScript

require("@babel/core").transformSync("code",{
plugins:["@babel/plugin-transform-react-jsx-compat"],
});