Question

标题解释了这一切，这是上下文

所以我的伙伴有这个index.js，他用react-scripts start

运行

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, browserHistory} from 'react-router';

import App from './components/App.jsx';
import SignUp from './components/SignUp.jsx';
import SignIn from './components/SignIn.jsx';

ReactDOM.render(
    <Router path="/" history={browserHistory} >
        <Route path="/app" component={App} />
        <Route path="/signup" component={SignUp} />
        <Route path="/signin" component={SignIn} />
    </Router>,
    document.getElementById('root')
);

在这里，我在这个app.js

的后端

const express = require('express');
const bodyParser = require('body-parser');

const app = express();

const public_folder = '/public';
// app.use(express.static(__dirname + public_folder));

app.set('trust proxy', 1) // trust first proxy

app.get('/', function (req, res) {
  res.send('hello, world!')
})

require('./server/routes')(app);

app.get('*', function(req, res) {
    console.log("Went into catch all *");
    // res.sendFile(__dirname + public_folder  + '/index.html');
});


module.exports = app;

我从以下教程中学到了一些基本的Node，我有点了解React是如何工作的，但现在我和我的伙伴正处于我们需要合并两半的阶段。有人能说清楚我需要做什么吗？我愿意根据需要提供更多细节。我们需要使用Babel，因为我们有jsx文件吗？

Answer 1

是的，如果您想在后端渲染React组件并使用Express提供它们，则必须使用Babel或其他一些转换器来转换服务器端代码。然后，您可以使用renderToString创建HTML字符串，并将其与您的回复一起发送。

试图将我的合作伙伴的React代码与我的Node后端结合起来

1 个答案: