Reactjs react路由器嵌套路由器刷新网页错误

当我使用指向=/Home/PageA的链接时，它工作得很好，但是当我刷新页面或在brower中键入/Home/PageA时，包将出错

它是有一些冲突的网页和反应路由器？如何修复它

Thx提前

这是我的照片

这是我的密码：

---

这是关于服务器端的渲染。您需要将服务器端路径映射到路由器对象。退房

默认情况下使用browserHistory，您可以在此处阅读更多有关如何正确配置它的内容：

或者使用哈希历史记录，更容易完成：

---

你应该像Lukas在下面回答的那样对dev服务器进行网页打包。我不知道，你能解释更多细节吗？你的服务器必须配置为将所有路由路由到index.html，或者如果这对你的情况没有帮助，你必须编写一些服务器，将请求的url映射到react的路由器。或者您可以使用hashtag history并忘记所有这些：

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, IndexRoute, browserHistory, Link } from 'react-router'

    const App = (props) => {
        console.log("App", props);
        const key = 'root';
        return (
            <div>
                {React.cloneElement(props.children || <div />, { key })}
            </div>
        );
    };


    const LoginPage = (props) => {
        console.log("Login", props);

        return (
            <div className="Image">
                <h1>this is LoginPage</h1>
            </div>
        );
    };

    const HomePage = (props) => {
        console.log("Home", props);
        return (
            <div className="Image">
                <li><Link to="/Home/PageA">Tab 1</Link></li>
                <h1>this is  Home page</h1>
                {React.cloneElement(props.children || <div />, { key: props.pathname })}
            </div>
        );
    };

    const PageA = (props) => {
        console.log("pageA", props);
        return (
            <div>
                <input type='button' value="back" onClick={props.router.goBack}></input>
                this is pageA;
            </div>
        );
    };



    ReactDOM.render((
        <Router history={browserHistory}>
            <Route path="/" component={App}>
                <Route path="Login" component={LoginPage}>
                </Route>[enter image description here][1]
                <Route path="Home" component={HomePage}>
                    <Route path="PageA" component={PageA}>
                    </Route>
                </Route>
            </Route>
        </Router>

    ), document.getElementById('container'));

module.exports = {
    devtool: 'source-map', 
    entry: __dirname + "/app/app.js", 
    output: {
        path: __dirname + "/app", 
        filename: "bundle.js" 
    },
    module: { 
        loaders: [
            {
                test: /\.json$/,
                loader: "json"
            }, {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel', 
                query: {
                    presets: ['es2015', 'react']
                }
            }, {
                test: /\.css$/,
                loader: 'style!css' 
            }, {
                test: /\.(png|jpg)$/,
                loader: 'url?limit=25000'
            }
        ]
    },
    devServer: {
        port: "9023",
        contentBase: "./app", 
        colors: true, 
        historyApiFallback: true, 
        inline: true 
    }
}