2017-11-04 3 views
0

ich ein Problem mit der Route perfekt miteinander harmonieren in reagieren-Router 4. Meine Routen sind:Einige Routen passend nicht reagieren-Router 4

<Switch> 
    <Route exact path='/' component={Home} /> 
    <Route path='/communities/create' component={CreateCommunity} /> 
    <Route component={PageNotFound} /> 
</Switch> 
  • Für /, erhalte ich die Homepage (OK).
  • Für/test, bekomme ich die Seite nicht gefunden (OK).
  • Für/communities/create, bekomme ich eine leere Seite (nicht OK).
  • Für/test/2, erhalte ich eine leere Seite (nicht OK)

Wenn es mehr als eine "/" in meinem Weg ist, habe ich eine leere Seite angezeigt. Wie kann ich jemals eine leere Seite bekommen? Es sollte zumindest eine "Not Found" -Seite rechts sein. Aber für mehr als ein "/" bekomme ich eine leere Seite. Keine der Routen scheint zu passen.

+0

Sieht nicht so aus, als ob das Problem im gegebenen Snippet liegt. Wenn es eine leere Seite anzeigt, ist es möglich, dass keine Ihrer Komponenten geladen wird. Siehst du etwas in der Konsole? –

+0

Ja, ich habe einen Konsolenfehler erhalten: Ressource konnte nicht geladen werden: Der Server hat mit dem Status 404 (Not Found) geantwortet. Ich verwende 'historyApiFallback: true' in der DevServer-Konfiguration für das Webpack. – vijayst

Antwort

0

Scheinbar hat das Problem nichts mit der Konfiguration des reaktiven Routers zu tun. Aber mehr mit der Konfiguration des Webpacks.

Ich benutze HistoryApiFallback: True-Einstellungen mit Webpack-Dev-Server. Alle Routen werden von index.html mit der obigen Konfiguration bedient. Aber es scheint zu funktionieren, wenn publicPath in der Ausgangskonfiguration wird wie folgt eingestellt:

output: { 
    path: path.resolve(__dirname, 'dist'), 
    filename: 'bundle.js', 
    publicPath: '/' 
}, 

Ich konnte es lösen mit den github issue in reagieren-vorformulierten.