Réagir App sur le serveur Apache, guide pour la mise en place?

Question

J'ai construit une application React en utilisant le Facebook create-react-app et tout fonctionne bien localement, j'ai aussi un plan d'hébergement qui utilise un serveur Apache. En essayant d'en savoir plus sur le routage côté client par rapport au serveur, j'ai trouvé cela génial post, ce qui me semble logique. Je veux utiliser la solution Catch-all (bien que, j'utilise le routeur de réaction v4, qui semble fonctionner quelque peu différemment que v3) ...

Comme quelqu'un complètement nouveau aux serveurs dorsaux, et aucune connaissance d'Apache Existe-t-il de bons guides ou suggestions sur la façon de configurer une application React sur un serveur Apache (avec le routeur de réaction v4)? (Ceci est ma première tentative d'installer quelque chose sur un serveur.)

Merci pour toute indication.

Answer 1

J'ai rencontré votre problème lorsque je suis venu héberger ma première application de rendu côté client avec React. Pour le rendre encore pire, j'utilisais un framework PHP MVC comme backend de l'API utilisée par l'application. Appels d'API auxquels je devais accéder localement sur le même serveur et l'environnement.

Voilà comment je résolu mon problème:

1. mettre le code HTML de construction/index.html dans le fichier d'index de mon application MVC
2. de contenu statique déplacé (CSS, faisceaux JSS) accessible pour mon système dorsal . C'était en racine/build
3. actifs Edité références dans le fichier d'index (changé à l'étape 1) à points au nouvel emplacement (changé à l'étape 2)

Et cela a fonctionné parfaitement bien! Maintenant, dans votre cas, vous pouvez suivre le même modèle et placer votre fichier build/index.html comme si vous exécutez une page HTML normale et déplacer les éléments vers un emplacement accessible.

Answer 2

Imaginé celui-ci par moi-même, était beaucoup plus simple que prévu. Je viens de courir npm build & placé tous mes fichiers de construction à la racine. Et puis modifié le fichier .htaccess dire:

Options -MultiViews 
RewriteEngine On 
RewriteCond %{REQUEST_FILENAME} !-f 
RewriteRule^index.html [QSA,L] 

Jusqu'à présent, tout semble fonctionner parfaitement. Faites-moi savoir s'il y a des problèmes avec cette solution. Comme cela a été construit sur le create-react-app, il n'a pas besoin de eject la config webpack intégrée.

Merci pour le conseil.