Reagieren Routen funktionieren nicht in Facebook create-react-app Build

Question

Ich benutze Reagieren Router, um die Routen zu definieren. Und ich verwende create-react-app für Entwicklungen. Meine Frage ist, wenn ich die URL für Unterseiten in der Adressleiste eintippe und versuche, sie zu besuchen, funktioniert in der Entwicklung, aber nicht im Produktionsaufbau.

I aa einfachen Express Server verwenden für die Ausrichtung der Produktion baut

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

Sie müssen Ihre Webserver dienen die gleiche Seite für alle Routen, die Sie definiert haben, oder implementieren serverseitige Konfiguration in Rendering Reagieren . Der Entwicklungswebserver ist wahrscheinlich als solcher konfiguriert, aber der Produktionsserver (Apache? Nginx? Etwas anderes?) Ist es nicht. This question könnte helfen.

Der Grund, warum dies ist, ist, dass React beim Erstellen von einseitigen Anwendungen verwendet wird. Sie haben eine einzige traditionelle Webseite, die einige Skripte lädt - die Ausgabe Ihres Build-Prozesses höchstwahrscheinlich, und dann kümmern sich diese Skripte um alles andere. Dazu gehört das Generieren eines neuen DOM, Anfragen an den "Server" nach Daten und sogar ein mehrseitiges App-Verhalten, indem die URL manipuliert wird, wenn sich die Ansichten ändern. Dieses letzte Bit ist was reaction-router tut.

Allerdings sind Webserver diese Dinge normalerweise nicht bewusst. Sie wissen, wie man URLs bedient. Und wenn Sie yourdomain.com/ anfordern, werden sie diese Hauptseite bedienen, aber wenn Sie yourdomain.com/some/page/123 anfordern, werden sie nicht wissen, was zu liefern ist, wenn sie nicht speziell konfiguriert sind. Und eine Konfiguration besteht darin, auch den Inhalt der Hauptseite für diese anderen URLs zurückzugeben. React-Router wird die URL abholen und die richtigen Komponenten verwenden, damit alles gut aussieht.>