ディープルートのwebpack historyApiFallback設定

Question

webpack-dev-serverを設定すると、index.htmlに戻ってhttp://localhost:4301/sdrのような単一ルートのスクリプトを見つけることができますが、深いルート/最後に）http://localhost:4301/sdr/dogそれは混乱します。 http://localhost:4301/sdr/dogと

devServer: { 
    contentBase: './dist', 
    historyApiFallback: true 
    }, 

サーバーはbundle.js

私はこれをどのように修正することができますため、検索ではパスに/ SDRを追加

x GET http://localhost:4301/sdr/bundle.js 

を応答します。 ...それからNGINXで反応ルータを使って試してみましょう。次に反応ルータと反応させてナビゲートしてみましょう。

Answer 1

私もこの問題を抱えていました。私の解決策は、出力の下にwebpack configにpublicPath: '/'を追加することだとわかりました。ここで

const base = { 
    entry: [ 
    PATHS.app, 
    ], 
    output: { 
    path: PATHS.build, 
    publicPath: '/', 
    filename: 'index_bundle.js', 
    }, 
    module: { 
    loaders: [ 
     {test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader'}, 
     {test: /\.css$/, loader: 'style!css?sourceMap&modules&localIdentName=[name]__[local]___[hash:base64:5]'}, 
     {test: /\.json$/, loader: 'json'}, 
    ], 
    }, 
    resolve: { 
    root: path.resolve('./app'), 
    }, 
} 

const developmentConfig = { 
    devtool: 'cheap-module-inline-source-map', 
    devServer: { 
    contentBase: PATHS.build, 
    hot: true, 
    inline: true, 
    progress: true, 
    proxy: { 
     '/api': 'http://127.0.0.1:5000', 
    }, 
    historyApiFallback: true, 
    }, 
    plugins: [HTMLWebpackPluginConfig, new webpack.HotModuleReplacementPlugin()], 
} 

export default Object.assign({}, base, developmentConfig) 

は、このプロパティのより詳細な文書である：ここではhttp://webpack.github.io/docs/configuration.html#output-publicpath

は、この問題のより詳細な議論があったフォーラムです： https://github.com/webpack/webpack/issues/443