在 IO.js 中使用 JSX

Question

我正在开发一个 React.js 应用程序，使用 IO.js 进行快速处理。我用 JSX 组件制作了一个 HelloWorld class，它将是 return.

'use strict'
 const React=require('react');
 class HelloWorld extends React.component{
  render(){
   return <h1>Hello,{this.props.name}</h1>
  }
 }
 module.exports=HelloWorld

当我在 IO.js 上编译时出现这个错误：

return <h1>Hello,{this.props.name}</h1>
           ^

SyntaxError: Unexpected token <
 at exports.runInThisContext (vm.js:53:16)
 at Module._compile (module.js:413:25)
 at Object.Module._extensions..js (module.js:448:10)
 at Module.load (module.js:355:32)
 at Function.Module._load (module.js:310:12)
 at Module.require (module.js:365:17)
 at require (module.js:384:17)
 at Object.<anonymous> (/home/raulgf92/Proyectos/helloWorldReact/index.js:4:18)
 at Module._compile (module.js:430:26)
 at Object.Module._extensions..js (module.js:448:10)

明显的问题是编译 JSX。 IO.js ¿有 IO.js 任何编译标志，可以在此程序上使用 JSX？或者我需要使用以前的 babel 编译？

Answer 1

使用 babel 可以解决问题，但是 IO.js fflag for JSX 会是更有效的解决方案。对于在 babel 中翻译 JSX：

安装babel：

npm install --save-dev babel-cli babel-preset-env
npm install --save-dev babel-plugin-transform-react-jsx

加载.babelrc:

{
 "plugins": [
  ["transform-react-jsx", {
   "pragma": "dom" // default pragma is React.createElement
  }]
 ]
}

翻译代码或class你喜欢使用命令：

babel --plugins transform-react-jsx FILE_TO_TRANSFORM >> FILE_TO_SAVE

在 IO.js 中使用 JSX

Using JSX in IO.js

javascript

jsx

node.js