Блог

Я попытался развернуть свое приложение react на страницах github, но получаю ошибку 404. Однако сайт может получить доступ к моему приложению, поскольку страница 404 является моей пользовательской. Я выполнил шаги по развертыванию изhttps://github.com/gitname/react-gh-pages.
Страница github https://ritsar.github.io/LapStore / и соответствующий удаленный репозиторий находится по адресуhttps://github.com/RitSar/LapStore. Я не получаю ошибок на терминале при запуске npm run deploy .
Я пытаюсь создать ritsar.github.io/LapStore свой root, то есть получить доступ index.html . При навигации по сайту с панели навигации домашняя страница направляется на ritsar.github.io/ , где изображения недоступны, а корзина направляется на /cart вместо /LapStore/cart .

package.json

 {
  "homepage": "http://RitSar.github.io/LapStore",
  "name": "e-commerce",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "bootstrap": "^4.5.2",
    "jquery": "^3.5.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-owl-carousel": "^2.3.1",
    "react-router-dom": "^5.2.0",
    "react-scripts": "^3.4.3",
    "serialize-javascript": "^4.0.0",
    "styled-components": "^5.1.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "gh-pages": "^3.1.0"
  }
}
  

Я попытался изменить "homepage" на "http://RitSar.github.io" , "." , "http://RitSar.github.io/LapStore/index.html" , внес незначительные изменения в index.html и перераспределенный, изменил папку филиала в настройках github на /docs from /(root) в соответствии с соответствующими предложениями из других потоков.
То же приложение, размещенное на heroku, находится по адресуhttps://lapstore-ritsar.herokuapp.com /. (Медленная загрузка страницы, несмотря на изображения размером менее 50 КБ, является проблемой в другой раз, я хотел бы знать, как правильно развернуть то же самое на страницах github).

Ваша главная страница с маршрутизатором <Route exact path="/" component={ProductList}></Route> . С exact path он не будет работать на gh-page, и вам нужно добавить еще 1 маршрут /LapStore .

Попробуйте удалить exact маршрут и добавить новый маршрут:

 <Route path="/" component={ProductList}></Route>
<Route path="/LapStore" component={ProductList}></Route>