web-dev-qa-db-fra.com

NetLify Renders 404 sur la page Actualiser (en utilisant React et réacteur-routeur)

J'ai déployé mon site avec Netlify et j'ai des problèmes avec le routage.

Voici mon site Web : https://reux-co.netlify.com/

Et mon repo github: https://github.com/jenna-m/redux-co

Spécifiquement, si un utilisateur navigue sur une page en plus de la page d'accueil et rafraîchit la page, le NetLify 404 par défaut Rend. De la page 404, si je navigue sur la page d'accueil et que vous rafraîchissez, la page d'accueil est rendue.

En outre, ma page Custom 404 ne fonctionne pas car elle le fait quand je suis sur localhost:3000, mais j'aimerais obtenir ce problème d'actualisation figure d'abord avant de traiter mon composant 404 personnalisé.

J'utilise React et réacteur-routeur, et je comprends que depuis que j'utilise React-Router, mon site Web ne se déploie pas hors de la boîte.


C'est mon _redirects fichier, qui est dans le /public Dossier avec mon index.html fichier:

/*    /index.html   200

C'est mon “build” situé dans package.json:

…
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build && cp build/index.html build/404.html",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  }
…

J'ai lu sur d'autres personnes qui ont rencontré cela et ce qu'ils ont fait pour surmonter le problème. C'est ce que j'ai référencé jusqu'à présent ...

https://www.freecodecamp.org/news/how-a-deploy-a-react-application-a-netlify-363b8a98a985/

https://hugogiraudel.com/2017/05/13/USTION-Créate-react-app-on-netlify/

Cette personne utilisait Vue et pas réagir, mais j'ai donné à ces solutions une tentative de toute façon:

https://github.com/vuejs/vuepress/issues/457#issuecomment-390206649

https://github.com/vuejs/vuepress/issues/457#issuecomment-463745656

18
Jenna

De votre index.js, enveloppez votre composant avec HashRouter au lieu de tout ce qui est là plus tôt. N'oubliez pas d'importer HashRouter à partir de React-Router-Dom.

C'est magique.

0
GeniusHawlah