Warum Reagieren Webpack Aufbau der Produktion zeigt Leere Seite?

Habe ich es herausgefunden, ich war mit browserHistory, ohne einen lokalen server. Wenn ich es geändert hashHistory es funktionierte. Um zu testen, webpack Produktion vor Ort mit reagieren-router, browser-history, die ich brauchte, um dies zu tun Konfigurieren eines Servers:

Dein server muss bereit sein, zu handhaben Reale URLs. Wenn Sie die app zum ersten mal geladen und in /wird es wahrscheinlich funktionieren, aber wie navigiert der Anwender herum und trifft dann auf aktualisieren unter /accounts/23 Ihr web-server erhält eine Anfrage auf /Konten/23. Sie werden es brauchen, um die URL und fügen Sie Ihrem JavaScript-Anwendung, die in der Antwort.

Einen express-app könnte so Aussehen:

const express = require('express')
const path = require('path')
const port = process.env.PORT || 8080
const app = express()

//serve static assets normally
app.use(express.static(__dirname + '/public'))

//handle every other route with index.html, which will contain
//a script tag to your application's JavaScript file(s).
app.get('*', function (request, response){
  response.sendFile(path.resolve(__dirname, 'public', 'index.html'))
})

app.listen(port)
console.log("server started on port " + port)

Und nur im Falle das jemand bereitstellen auf FB mit reagieren-router mit browser-history dazu:

{
  "firebase": "<YOUR-FIREBASE-APP>",
  "public": "<YOUR-PUBLIC-DIRECTORY>",
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ],
  "rewrites": [
    {
      "source": "**",
      "destination": "/index.html"
    }
  ]
}

GitHub-Seiten keine Unterstützung für Router, die die HTML5 - pushState Geschichte-API unter der Haube (zum Beispiel, Reagieren Router mit browserHistory). Dies ist, weil, wenn es eine neue Seite geladen werden, für die eine url wie http://user.github.io/todomvc/todos/42, wo /todos/42 ist ein Front-End-route, die GitHub-Seiten-server gibt 404 zurück, weil er weiß nichts von /todos/42. Wenn Sie möchten, fügen Sie einen router, um ein Projekt, gehostet auf GitHub Seiten, hier sind ein paar Lösungen:

• Könnten Sie wechseln von der Nutzung von HTML5-history-API routing-hashes.
  Wenn Sie Reagieren-Router, können Sie wechseln, um hashHistory für diesen Effekt, aber die URL wird länger und Ausführlicher (zum Beispiel http://user.github.io/todomvc/#/todos/42?_k=yknaj). Lesen Sie mehr über unterschiedliche Geschichte Implementierungen Reagieren Router.
• Alternativ können Sie einen trick zu lehren GitHub-Seiten zu handhaben 404 umleiten, um Ihre index.html Seite mit einem speziellen redirect-parameter. Benötigen Sie noch einen 404.html - Datei mit der Umleitung code auf der build Ordner, bevor Sie Ihre Projekt, und Sie müssen den code hinzufügen Umgang mit den redirect-parameter index.html. Sie finden eine detaillierte Erklärung zu dieser Technik in dieser Anleitung.