サーバサイドのnode.jsでreactJSを使用しているときに<が認識されない

Question

node.jsで書かれたサーバ側からReactコンポーネントを渡したいとします。 コード（server.js）：

var ReactDOMServer = require('react-dom/server'); 
var ReactApp = require('./console/ReactApp'); 
app.get('*', function(req, res, next){ 
    var reactHtml = ReactDOMServer.renderToString(<ReactApp />); 
    res.render('index', 
    {reactOutput: reactHtml}); 
}); 

コンソール/ ReactApp.js：node server.js

var reactHtml = ReactDOMServer.renderToString(<ReactApp />); 
               ^
at exports.runInThisContext (vm.js:53:16) 
    at Module._compile (module.js:373:25) 
    at Object.Module._extensions..js (module.js:416:10) 
    at Module.load (module.js:343:32) 
    at Function.Module._load (module.js:300:12) 
    at Module.require (module.js:353:17) 
    at require (internal/module.js:12:17) 
    at Object.<anonymous> (/.../www.js:7:11) 
    at Module._compile (module.js:409:26) 
    at Object.Module._extensions..js (module.js:416:10) 

Answer 1

を実行している場合、両方のファイルで

var React = require('react');  
var ReactApp = React.createClass({  
    render: function() { 
     return <div>Hello World</div>; 
    } 
}); 
module.exports = ReactApp; 

は、 '<>' にSyntaxErrorを生成ということですJSX。あなたは、使用前にトランスバイルするか、バベルノードで実行する必要があります（後者は推奨されていません）。

それとも、このようtranspiledコードを使用することができます：

var reactHtml = ReactDOMServer.renderToString(React.createElement(ReactApp)); 

See full api of React.createElement here