Question

我正在使用react路由器来定义路由。我正在使用create-react-app进行开发。我的问题是，如果我在地址栏中键入子页面的URL并尝试访问它在开发构建中工作，但不在生成构建中。

我正在使用一个简单的快速服务器来托管生产版本

var express = require('express'),
  app = express(),
  http = require('http'),
  httpServer = http.Server(app);

app.use(express.static(__dirname + '/build'));

app.get('/', function(req, res) {
  res.sendfile(__dirname + '/index.html');
});
app.listen(3001);

Answer 1

您必须将Web服务器配置为为您定义的所有路由提供相同的页面，或者在React中实现服务器端呈现。开发网络服务器可能是这样配置的，但是生产网络服务器（Apache？Nginx？还有其他什么？）不是。 This question可能有帮助。

之所以如此，是因为React用于构建单页面应用程序。您有一个传统的网页，它可以加载一些脚本 - 最有可能的构建过程输出，然后这些脚本会处理其他所有内容。这包括生成新DOM，向“服务器”请求数据，甚至通过在视图更改时操纵URL来伪造多页面应用程序行为。最后一点是react-router的作用。

但是，Web服务器通常不会注意到这些事情。他们知道如何提供网址。当您请求yourdomain.com/时，他们将为该主页提供服务，但是当您请求yourdomain.com/some/page/123时，他们将无法知道要提供什么，除非特别配置。一种配置是还返回这些其他URL的主页面内容。 React-router将获取URL并使用适当的组件，因此一切看起来都不错＆gt;

在facebook的create-react-app构建中，React路由不起作用

1 个答案: