React-router bundle.jsでWebpackを使用していません

Question

Webpackとreact-rounterでプロジェクトをビルドします。 これは私のコードです：

ReactDOM.render(
 
    <Provider store={store}> 
 
     <Router history={ browserHistory }> 
 
      <Route path='/' component={ App } > 
 
       <IndexRoute component={ Home } /> 
 
       <Route path="purchase" component={ Purchase } /> 
 
       <Route path="purchase/:id" component={ Purchase } /> 
 
      </Route> 
 
     </Router> 
 
    </Provider>, 
 
    document.getElementById('example') 
 
);

私は"http://127.0.0.1:3001/purchase"を要求すると、それが動作しています！アドレス"http://127.0.0.1:3001/purchase/a"にはエラーがあります。エラーメッセージを見る：enter image description here

マイWebpackDevServerの設定は次のとおりです。

new WebpackDevServer (webpack(config), { 
 
    publicPath: config.output.publicPath, 
 
    hot: true, 
 
    noInfo: false, 
 
    historyApiFallback: true 
 
}).listen(3001, '127.0.0.1', function (err, result) { 
 
     if (err) { 
 
      console.log(err); 
 
     } 
 
     console.log('Listening at localhost:3001'); 
 
    });

私は問題は、私を助けているかわかりません！

Answer 1

index.htmlにあるbundle.jsのパスを表す相対パスを使用しています。

あなたは

絶対パスはルートディレクトリとファイルやフォルダが含まれている他のすべてのサブディレクトリが含まれているあなたのindex.htmlにbundle.jsの絶対パスを使用する必要があります。

index.htmlと同じパスにある場合。

例えば、

public/index.html

public/bundle.js

これはあなたの問題を解決するだろう。

<script src="/bundle.js"></script>