Как развернуть приложение реагирования на GitHub Pages в производственном режиме? - PullRequest
0 голосов
/ 17 февраля 2019

Итак, я создал базовое приложение React после учебника, чтобы использовать его в качестве своей новой домашней страницы GitHub.Когда я запускаю npm локально, он показывает мое приложение React, как показано ниже.Однако, когда я захожу на свой адрес страницы GitHub (https://robagruen.github.io/),), я получаю второе изображение. Я посмотрел в Интернете, и у меня возникают проблемы с выяснением того, что происходит с этим. Я запустил оба npm run build и npm run deploy, и скрипт запускается, оставляя выходное сообщение «Опубликовано», однако мне кажется, что это не так. Я также добавил "predeploy": "npm run build" и "deploy": "gh-pages -d build" в мой файл package.json.Кто-нибудь еще сталкивался с этим раньше на страницах GitHub? Буду очень признателен за любой полезный совет! Спасибо.

Local version of my react app Github Pages version of the react app

Ответы [ 4 ]

0 голосов
/ 26 февраля 2019

изменить сценарий развертывания с "gh-pages -d build" для "gh-pages -b master -d build".

Это необходимо только для личных веб-сайтов [имя пользователя] .github.io.

0 голосов
/ 17 февраля 2019

Вы используете ветку master для функции страниц Github, и поэтому файл README отображается в качестве главной страницы.

Установите для ветви по умолчанию значение gh-pages в настройках хранилища или измените развернутый источник React на master.

0 голосов
/ 17 февраля 2019

Как вы пытаетесь развернуть на странице пользователя GitHub:

https://yourUserName.github.io/

В отличие от страницы проекта:

https://yourUserName.github.io/yourRepo

Вам нужно выполнить несколько другие шаги:

Создайте новую копию своей ветки Master (вы можете назвать ее как хотите):

$ git checkout -b source
$ git push origin source

Таким образом, ветвь источника является прямой копией нашего мастера.Следующие шаги:

  1. Перейдите в репозиторий на Github и выберите «Настройки».
  2. На левой боковой панели нажмите «Филиалы».

Рисунок: Изменение ветви по умолчанию

После этого вы сможете выбрать ветку «Источник» и обновить ее.Теперь в терминале (ветке источника) запустите:

развертывание пряжи

Подождите пару минут, обновитесь, и вы сможете увидеть свой сайт по адресу:

  https://yourGitUser.github.io/

Внесение изменений:

ВашИсходная ветка ведет себя как ваш хозяин.Так что для следующих изменений, объедините ваши изменения с источником.

Вы можете найти больше информации об этом в следующей статье: https://dev.to/javascripterika/deploy-a-react-app-as-a-github-user-page-with-yarn-3fka

Обратите внимание, что если в следующем проекте вы развернете страницу проекта,Вы можете выполнить шаги, описанные здесь: https://facebook.github.io/create-react-app/docs/deployment#github-pages-https-pagesgithubcom

0 голосов
/ 17 февраля 2019

Не совсем уверен, что это проблема, потому что я никогда не развертывался на страницах github, но похоже, что URL-адрес страницы должен быть отформатирован так:

http://{username}.github.io/{repo-name}

Согласно этому ресурсу https://github.com/gitname/react-gh-pages/blob/master/README.md

...