При использовании response-router-dom BrowserRouter никогда не работает, а HashRouter только иногда работает. Почему? - PullRequest
0 голосов
/ 27 апреля 2020

Я новичок в React и реакции-router-dom, и они бросают меня через все oop.

В настоящее время HashRouter работает как положено в режиме разработки и на производстве с использованием страниц Github:

import React from 'react';
import './css/main.css';
import { BrowserRouter, HashRouter, Switch, Route } from 'react-router-dom';
import AboutMe from './components/pages/AboutMe';
import MyWork from './components/pages/MyWork';
import HowToReachMe from './components/pages/HowToReachMe';
import LandingPage from './components/pages/LandingPage';

export default function App() {
  return (
    <HashRouter>
      <Switch>
        <Route exact path="/" component={LandingPage} />
        <Route path="/AboutMe" component={AboutMe} />
        <Route path="/MyWork" component={MyWork} />
        <Route path="/HowToReachMe" component={HowToReachMe} />
      </Switch>
    </HashRouter>     
  );
}

Однако использование BrowserRouter приводит к пустой серой или белой странице без ошибок:

  return (  
      <BrowserRouter>
        <Switch>
          <Route exact path="/" component={LandingPage} />
          <Route path="/AboutMe" component={AboutMe} />
          <Route path="/MyWork" component={MyWork} />
          <Route path="/HowToReachMe" component={HowToReachMe} />
        </Switch>
      </BrowserRouter>
  );

Теперь, когда я пытаюсь использовать свой собственный домен со страницами github, я получаю пустую белую страницу без ошибок, используя BrowserRouter или HashRouter. Я уверен, что правильно настроил домен, потому что вы все еще можете просматривать тег head, используя инструменты разработчика (https://connor-mote.com/).

Почему BrowserRouter или HashRouter не работают с пользовательским доменом, использующим страницы GitHub?

Ссылка Github Repo

1 Ответ

1 голос
/ 27 апреля 2020

Действуя как path=\, при развертывании он появляется на 'yourBaseAdress\' +'\', просто добавьте basename к Router


 <BrowserRouter basename={process.env.PUBLIC_URL}>
     {/* routes */}
 </BrowserRouter>
...