'<'在服务器端node.js中使用reactJS时无法识别

'<' not recognized when using reactJS in server-side node.js

本文关键字：reactJS 识别 js lt 服务器端 node      更新时间：2024-04-07

我想从服务器端传递React Component，它是用node.js编写的。代码（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});
});

console/RectApp.js:

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

在这两个文件中，'<>'运行node server.js 时生成SyntaxError

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)

这就是JSX。您需要在使用前对其进行转换，或者使用babel节点运行它（后者不是推荐的方法）。

或者你可以使用这样的transpiled代码：

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

请参阅React.createElement的完整api

相关文章：