기본 이름이 제대로 작동하지 않습니다.

Question

on the react-router docs과 같이 반응 라우터에 기본 이름을 사용하려고합니다. 이는 base href이 더 이상 사용되지 않기 때문입니다. 여기

내가 지금 무엇을 가지고 :

import { Route, Router, useRouterHistory } from 'react-router'; 
 
import { createHistory } from 'history'; 
 
import { render } from 'react-dom'; 
 

 
var history = useRouterHistory(createHistory)({ 
 
    basename: '/subdirectory' 
 
}); 
 

 
render(
 
    <Router history={history}> 
 
    <Route path='/' component={App}> 
 
     <Route path='next' component={Next} /> 
 
    </Route> 
 
    </Router>, 
 
    document.getElementById('root') 
 
);

합니다 (App 구성 요소를 렌더링) 예상대로 내가 http://the-url.com/subdirectory 페이지가로드로 이동합니다. 그러나 http://the-url.com/subdirectory/next으로 갈 때 404 오류가 발생합니다. 내의 nginx의 설정은 다음과 같습니다

location /subdirectory { 
    alias /path/to/index.html; 
    index index.html; 
    try_files $uri $uri/ /path/to/index.html; 
} 

Answer 1

내가 사용하여 그것을 해결 :

import { Router, useRouterHistory } from 'react-router' 
import createBrowserHistory from 'history/lib/createBrowserHistory' 

const history = useRouterHistory(createBrowserHistory)({ 
    basename: '/', 
}) 

<Router history={history}> 

내가 문제가 history 패키지의 다른 버전이라고 생각. react-router@2.2.4은 history@2.1.2을 사용하고 history은 이미 4.5.1입니다. 올바른 버전의 history 패키지를 설치하십시오.