ベース名が正しく動作しません

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パッケージをインストールしてください。