Как изменить правила маршрутов одностраничного React приложения для деплоя на gh-pages?

Question

[youwereneverreallyhere]

Есть рабочее одностраничное приложение на react. Требуется перенести это приложение на gh-pages. У gh-pages корень приложения выглядит так https://name.github.io/repo/ Приложение на react имеет различные файлы. Логотип к примеру находится здесь /config/images/logo.png Когда мы запускаем приложение на gh-pages то это приложение не видит этот логотип потому как ожидает его увидеть здесь https://name.github.io/config/images/logo.png а у нас он находится здесь https://name.github.io/repo/config/images/logo.png

Answer 1

[Виктор Путин]

Для роутинга в gh-pages нужно обернуть приложение в HashRouter вместо BrowserRouter / Router

Почему и зачем это нужно

Comments

[youwereneverreallyhere]

В файле index.js добавили импорт
import { HashRouter } from "react-router-dom";
и изменили

ReactDOM.render(
  <Provider store={store}>
    <HashRouter>
      <App />
    </HashRouter>
  </Provider>,
  document.getElementById("root")
);

Маршрут к логотипу не поменялся и, как и прежде его не видит приложение. Что ещё надо изменить, чтобы получить ожидаемый результат? Необходимо ли менять путь к файлу логотипа в файле приложения App.js?

Сейчас он выглядит так.

<StyledLogo alt={"logo"} src={"/config/images/logo.png"} />