从 js 到 jsx 的转换工具
Tool to transpile from js to jsx
我很好奇是否有任何转译工具可以将纯 JS 转换为 JSX。 Babel 会将 JSX 转换为 JS,但据我所知它不能返回 JSX。
来自example:
var Nav;
// Input (JSX):
var app = <Nav color="blue" />;
// Output (JS):
var app = React.createElement(Nav, {color:"blue"});
是否有相反方向的工具:
var Nav;
// Input (JS):
var app = React.createElement(Nav, {color:"blue"});
// Output (JSX):
var app = <Nav color="blue" />;
谢谢!
我自己还没有尝试过,但显然现在有一个 babel 插件可以完全按照您的要求进行操作。
babel-js-to-jsx
https://github.com/JoeStanton/babel-js-to-jsx
根据文档:
Babel 6 plugin to convert from desugared React.DOM CallExpressions ->
the equivalent JSX. Currently used to migrate to ES6+ from other
compile to JS languages.
It can be used as a plugin:
require("babel-core").transform(code, {
plugins: ["js-to-jsx", "syntax-jsx"],
}).code
Or from the command line for composition with
other tools:
npm install babel-plugin-js-to-jsx
cat example.ls | lsc -cb --no-header | js-to-jsx | esformatter -c format.json
我很好奇是否有任何转译工具可以将纯 JS 转换为 JSX。 Babel 会将 JSX 转换为 JS,但据我所知它不能返回 JSX。
来自example:
var Nav;
// Input (JSX):
var app = <Nav color="blue" />;
// Output (JS):
var app = React.createElement(Nav, {color:"blue"});
是否有相反方向的工具:
var Nav;
// Input (JS):
var app = React.createElement(Nav, {color:"blue"});
// Output (JSX):
var app = <Nav color="blue" />;
谢谢!
我自己还没有尝试过,但显然现在有一个 babel 插件可以完全按照您的要求进行操作。
babel-js-to-jsx
https://github.com/JoeStanton/babel-js-to-jsx
根据文档:
Babel 6 plugin to convert from desugared React.DOM CallExpressions -> the equivalent JSX. Currently used to migrate to ES6+ from other compile to JS languages.
It can be used as a plugin:
require("babel-core").transform(code, {
plugins: ["js-to-jsx", "syntax-jsx"],
}).code
Or from the command line for composition with other tools:
npm install babel-plugin-js-to-jsx
cat example.ls | lsc -cb --no-header | js-to-jsx | esformatter -c format.json