Javascript React路由器返回子路由上的404

我正在使用react、react路由器（v4）、redux和webpack（-dev server）构建一个应用程序。Devserver和所有东西都工作正常，包括HMR和

historyApiFallback

。表示当我输入

http://localhost:8080/how

我得到

index.html

，

bundle.js

（我的应用程序），以及正确的组件

呈现方式

我的基本路线如下所示：

//App.js 
<Router>
    <Wrapper>
        <Route path='/' component={MainNav} />
        <Route exact path='/' component={Splash} />
        <Route path='/how' component={How} />
        <Route path='/auth' component={Auth} />
        <Route path='/' component={Footer} />
    </Wrapper>

当我输入
http://localhost:8080/auth/login
。导航到
http://localhost:8080/auth/login
在应用程序中，例如在链接单击时，将呈现
登录
组件

我知道在StackOverflow上有很多类似的问题，但奇怪的是顶级路由的渲染没有问题，这只发生在嵌套路由上。另外，webpack dev server（
historyApiFallback
或
publicPath
）也可能没有问题，因为我还可以将应用捆绑到生产环境中，并将其与节点服务器一起使用，结果相同

我也看不出有什么不同

仅供参考，这是我的网页配置：

module.exports = {
    context: resolve(__dirname, 'app'),
    entry: debug ? [
        'react-hot-loader/patch',
        './index.js',
    ] : './index.js',
    output: {
        filename: 'bundle.js',

        path: resolve(__dirname, 'public'),

        publicPath: '/',
        // necessary for HMR to know where to load the hot update chunks
    },

    // possibly change to inline-source-map or something else
    devtool: debug ? 'eval' : false,

    devServer: debug ? {
        hot: true,
        compress: true,
        port: 8080,
        contentBase: resolve(__dirname, 'public'),
        publicPath: '/',
        historyApiFallback: true,
    } : { },
    module: {
        loaders: [
            { test: /\.js$/,
                loaders: [
                    'babel-loader',
                ],
                exclude: /node_modules/,
            },
            {
                test: /\.css$/,
                loaders: [
                    'style-loader',
                    'css-loader?modules',
                    'postcss-loader',
                ],
            },
        ],
    },

...
}

您需要确保您的服务器环境知道将所有请求转发到index.html文件，这取决于生成环境和服务器设置。您可以查看如何实现这一点以获取更多信息。谢谢，但我已经知道了。在
webpack dev server
中，通常
historyApiFallback
会这样做。在node中，最后一个路由是这样的：`app.use（'*'，（req，res）=>{res.sendFile（'index.html'）}在获取index.html还是获取.js/.css文件时返回404？@GProst这两者，节点服务器以及网页包开发服务器都返回请求的文件（例如
index.html
，
bundle.js
）.我没有css文件，因为我使用的是
样式化组件
，但资产（如图像）按预期提供。
module.exports = {
    context: resolve(__dirname, 'app'),
    entry: debug ? [
        'react-hot-loader/patch',
        './index.js',
    ] : './index.js',
    output: {
        filename: 'bundle.js',

        path: resolve(__dirname, 'public'),

        publicPath: '/',
        // necessary for HMR to know where to load the hot update chunks
    },

    // possibly change to inline-source-map or something else
    devtool: debug ? 'eval' : false,

    devServer: debug ? {
        hot: true,
        compress: true,
        port: 8080,
        contentBase: resolve(__dirname, 'public'),
        publicPath: '/',
        historyApiFallback: true,
    } : { },
    module: {
        loaders: [
            { test: /\.js$/,
                loaders: [
                    'babel-loader',
                ],
                exclude: /node_modules/,
            },
            {
                test: /\.css$/,
                loaders: [
                    'style-loader',
                    'css-loader?modules',
                    'postcss-loader',
                ],
            },
        ],
    },

...
}