如何使用React运行node.js服务器

Question

我正在尝试用React实现我的node.js服务器。我已经用react配置了webpack，但我不知道如何在服务器上启动它。不使用express.js有可能吗？现在它只是呈现index.html，而没有react中存在的其他页面。非常感谢。

Webpack.config

const HtmlWebPackPlugin = require("html-webpack-plugin");
const path = require('path');
module.exports = {
entry: "./src/index.js",
output: {
path: path.join(__dirname, 'dist'),
filename: "main.js"
},
plugins: [
new HtmlWebPackPlugin({
template: "./src/index.html", 
filename: "./index.html"
})
],
module: {
rules: [
{
test: /.(js|jsx)$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
presets: ['@babel/preset-env','@babel/preset-react'],
}
}
},
{
test: /.scss$/,
use: ['style-loader','css-loader','sass-loader']
}
]
}
};

server.js

const http = require("http");
const path = require("path");
const fs = require("fs");
const indexFile = path.join(__dirname, "../src", "index.html");
const server = http.createServer((req, res) => {
if (req.url === "/") {
fs.readFile(indexFile, "utf-8", (err, content) => {
if (err) {
throw err;
}
res.end(content);
});
}
});
server.listen(3000, () => {
console.log("server is running");
});

软件包.json

"scripts": {
"dev": " webpack --mode development && node server/server.js",
"build": "webpack --mode production"
},

Answer 1

您需要确保express设置为提供静态文件，例如：

app.use(express.static(path.join(__dirname, "dist/build")));

并使用sendFile而不是readFile:

app.get('*', (req, res, next) => {
res.sendFile(path.join(__dirname, "/dist/build", "index.html"));
});