Автор оригинала: Ezekiel Ekunola.
Я буду проходить через процесс развертывания приложения React из Github для NetLify.
Если у вас есть структура проекта, где приложение raction – Не вложено в подкаталоги, как в примере, показанном ниже
Вы можете использовать следующие шаги для развертывания:
- Нажмите свой код в github
- Подключите учетную запись GitHub к вашей учетной записи NetLify
- Выберите проект для развертывания
- Развертывание проекта
В случаях, когда приложение React находится в вложенном каталоге, как пример, показанный ниже
Добавить netlify.toml
Файл в корню вашего проекта и добавьте конфигурацию ниже в файл.
[build] command = "npm run build" publish="path-to-react-app/build" base = "path-to-react-app"
Реагнийный маршрутизатор
Если вы использовали реактивный маршрутизатор в вашем проекте, на перенаправлении и перезагрузке на новый маршрут, вы можете вступить в проблему, где NetLify бросит ошибку («страница не найдена»), как показано в примере ниже
Вы можете добавить следующий код для вашего netlify.toml
файл.
[[redirects]] from = "/*" to = "/index.html" status = 200
После добавления нажмите изменения в GitHub. NetLify должен автоматически развернуть изменения, если нет, разверните изменения вручную. После развертывания ваше приложение не должно бросать ошибки, как показано ниже.
Примечание: netlify.toml
Это файл конфигурации, в котором вы можете указать, как NetLify должен создать/запустить ваше приложение. Много может быть достигнуто с netlify.toml
файл. Узнайте больше о netlify.toml
Файл здесь.
Переменные среды
Если вы использовали переменные среды в вашем проекте, вы также можете добавить их в NetLify, следуя шагам, показанным на изображении ниже
Заключение
От вышеизложенного, мы видели и смогли продемонстрировать, что хостинг приложения React через GitHub в NetLify довольно просты и бесшовные, следовательно, можно сделать практически в нем.
Если у вас есть какие-либо вопросы или отзывы об этой статье, не стесняйтесь обращаться. Спасибо за прочтение.