Приложение React не отображается на живом сервере (работает локально) - нет видимых ошибок, подозрительная проблема с серверной частью - PullRequest
Новая
       7

Приложение React не отображается на живом сервере (работает локально) - нет видимых ошибок, подозрительная проблема с серверной частью

1 голос
/ 09 июля 2020

Можно использовать мудрость толпы на этом. Я только что обновил это приложение React, но, как вы видите, на странице ничего не отображается. Вот факты:

Ссылка на приложение | Репозиторий кода (хотя я не думаю, что проблема заключается в коде)

  1. Сборка dev отлично работает на localhost (npm start)
  2. Производство build отлично работает на локальном сервере (npm run build)
  3. Если вы посмотрите в инструментах разработчика по указанной выше ссылке, вы увидите, что все файлы загружаются 200 в браузере, ошибок в консоли нет или 404 s.
  4. Базовый href установлен на ./, что правильно, учитывая, что приложение находится в подкаталоге (и опять же, нет ошибок консоли)
  5. Есть в заголовках не установлен кеш, а в файлах stati c используются агрессивные методы кэширования . Я удалил старые файлы из каталога на сервере и загрузил производственную сборку, а также проверил кеш и файл .conf на сервере nginx на наличие чего-либо необычного.
  6. Это приложение было работал на прошлой неделе по этому URL-адресу (до того, как я недавно объединил два пул-реквеста), но изменения кода не коснулись ни одного компонента маршрутизации, и, опять же, приложение отлично работает на localhost и локальном сервере.

Итак, я чувствую, что упускаю что-то очевидное и могу использовать другие предложения. Я думаю, что проблема в серверной части, но я наткнулся на кирпичную стену и мог бы использовать вторую пару глаз для этого. Спасибо за любую помощь, которую вы можете предоставить.

1 Ответ

2 голосов
/ 09 июля 2020

В вашем приложении не определен маршрут, который соответствует /dev/impact. Если я вручную укажу sh / объекту истории, ваше приложение правильно отобразит компонент HowRichAmIStandalone на вашем производственном сервере.

Я думаю, что при разработке он работает, потому что ваш локальный сервер разработки обслуживает приложение, например, в localhost:3000/, а не localhost:3000/dev/impact. Вам необходимо установить правильный basename на маршрутизаторе , чтобы он работал: 

<Router basename="/dev/impact">
    {/* ... */}
</Router>

Вы также можете определить базовое имя в своем env и Делайте это /dev/impact только для производственной среды, если вы не хотите набирать localhost:3000/dev/impact при разработке. 

<Router basename={process.env.BASE_URL}">
    {/* ... */}
</Router>
...