reaction-router ne fonctionne pas dans les déploiements de production et de surtension

Question

Mon application de réaction fonctionne correctement sur localhost mais lorsque je l'ai déployée dans gh-pages ou surge il ne me permet pas de passer d'une page à l'autre.

• C'est le repo de projet link
• url Démo here

utilisateurs peuvent aller à inscrire la page en cliquant ligneMenu du coin supérieur droit. mais si l'utilisateur utilise http://chat.susi.ai/signup/ URL, il donne 404 page

J'ai essayé plusieurs solutions d'internet mais je n'ai pas travaillé.

La question suivante est: J'ai créé une page de 404 pour montrer quand l'utilisateur essaye de passer aux liens cassés. Cela fonctionne très bien dans localhost. mais pas en production. J'ai essayé la solution this mais rien n'a changé.

cela fait partie de mon index.js fichier

const App =() => (
    <Router history={hashHistory}> 
     <MuiThemeProvider> 
      <Switch> 
       <Route exact path="/" component={ChatApp} /> 
       <Route exact path="/signup" component={SignUp} /> 
       <Route exact path="/logout" component={Logout} /> 
       <Route exact path="/forgotpwd" component={ForgotPassword} /> 
       <Route exact path="*" component={NotFound} /> 

      </Switch> 
     </MuiThemeProvider> 
    </Router> 
); 

ReactDOM.render(
    <App />, 
    document.getElementById('root') 
); 

Si quelqu'un peut suggérer une bonne solution avec un exemple de code pour mes problèmes qui serait vraiment utile pour moi.

Answer 1

Cela se produit car les utilisateurs ne reçoivent pas le index.html qui amorce votre application lorsqu'ils visitent ces URL directement.

Pour surtension, vous pouvez add a 200.html file qui contient le même contenu que le index.html vous déployez (ou tout simplement le renommer à 200.html) - ce sera alors servi aux utilisateurs à tout URL qu'ils visitent qui ne correspond pas à un fichier statique, permettant à votre application de démarrer.

---

Édition: vous semblez utiliser create-react-app. Cela fonctionne lorsque vous développez localement car les poignées create-react-appreact-scripts de paquet servant votre index.html comme solution de repli pour ces demandes.

Le react-scripts user guide a des sections sur et surge.sh (comme ci-dessus).