У меня была та же проблема, что и у вас около 2 месяцев назад.У меня было очень мало знаний о рендеринге на стороне сервера с помощью React.Я запутался в общей концепции этого.Тем не менее, я не хотел использовать Cli-Act-App-Cli.Я хотел использовать свой собственный шаблон.Проведя исследование, я обнаружил, что мне пришлось сконфигурировать мой веб-пакет для обработки моих резервных перезагрузок 404.
Вот моя текущая настройка веб-пакета:
Обратите внимание, обратите внимание только на historyApiFallback: true
это позволяет вам обновить страницу, не выдавая ошибку 404, если вы используете v4.Кроме того, я забыл упомянуть, что для этого требуется webpack-dev-server.
const webpack = require('webpack');
const path = require('path');
const nodeExternals = require('webpack-node-externals');
const HtmlWebPackPlugin = require('html-webpack-plugin');
var browserConfig = {
devServer: {
historyApiFallback: true,
proxy: {
"/api": "http://localhost:3012"
}
},
entry: ['babel-polyfill', __dirname + '/src/index.js'],
output: {
path: path.resolve(__dirname + '/public'),
filename: 'bundle.js',
publicPath: '/'
},
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
query: {
presets: ['react', 'env', 'stage-0']
}
}
}
]
},
plugins: [
new HtmlWebPackPlugin({
template: './public/index.html',
})
]
}
var serverConfig = {
target: 'node',
externals: [nodeExternals()],
entry: __dirname + '/server/main.js',
output: {
path: path.resolve(__dirname + '/public'),
filename: 'server.js',
publicPath: '/'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
query: {
presets: ['react', 'env', 'stage-0']
}
}
}
]
}
}
module.exports = [browserConfig, serverConfig]