Reactjs 反应路由器不加载任何页面

我似乎无法使路线图正常工作。URL确实会更改，但页面不会更改。由于某种原因，路由器找不到匹配项。 我是webpack的自定义配置。我没有使用CreateReact应用程序。 使用CreateReact应用程序创建的项目的另一个版本运行良好。 我需要它提供的小型捆绑包的自定义配置

我的网页包配置：

module.exports = {
    entry: ['./src/index.js'],
    devtool: 'cheal-module-source-map',
    module: {
        rules: [
            { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" },
            {
                test: /\.s?css$/,
                use: [
                    'style-loader',
                    'css-loader',
                    'sass-loader'
                ]
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: 'public/index.html'
        }),
    ],
    devServer: {
        historyApiFallback: true,
    }

}

我的路由器.js

<Router history={history}>  
    <Switch>
      <Route path="/" component={SignUpPage} exact={true} />
      <Route path="/login" component={LoginPage} />
    <Switch>
<Router history={history}>

---

我认为webpack配置中有问题，

开关中的最后一个
路由
应该用于“404页”，因为其他路由的路径都不匹配



这是一个经过编辑的网页配置，可用于测试。它有一些额外的东西，如果你想的话，你可以把它们拿出来

为了确保安全，请将这些软件包作为devdependency（以及其他必需的软件包）安装


网页包、网页包cli、网页包开发服务器
样式加载器、css加载器、sass加载器、POSTSS加载器、文件加载器、自动引用器

const path=require（'path'）；
const HtmlWebpackPlugin=require（'html-webpack-plugin'）；
const DIST_DIR=path.resolve（_dirname，'DIST'）；
const PUBLIC_DIR=DIST_DIR+'/PUBLIC'；
常量规则=[
{
测试：/\.t？j？sx？$/,，
排除：“/node_modules/”，
用法：['babel-loader']，
},
{
测试：/\.s？css$/,，
使用：[
“样式加载器”，
{
加载器：“css加载器”，
选项：{
模块：对，
},
},
“sass loader”，
{
加载器：“postss加载器”，
选项：{
插件：函数（）{
返回[需要（'autoprefixer'）]；
},
},
},
],
},
{
测试：/\（svg | png | jpg | jpeg | gif）$/，
使用：{
加载器：“文件加载器”，
选项：{
名称：'[name].[ext]'，
outputPath:`${PUBLIC\u DIR}/assets/img`，
},
},
},
{
测试：/（ttf | otf | eot | woff（2））（\？[a-z0-9]+）？$/，
使用：[
{
加载器：“文件加载器”，
选项：{
名称：'[name].[ext]'，
outputPath:`${PUBLIC\u DIR}/assets/font`，
},
},
],
},
];
module.exports={
目标：“网络”，
条目：['./src/index.js']，
输出：{
路径：DIST_DIR，
文件名：“bundle.js”，
},
devtool:“cheal模块源映射”，
模块：{
规则，
},
插件：[
新HtmlWebpackPlugin({
模板：path.resolve（uu dirname，'public/index.html'），
}),
],
开发服务器：{
是的，
历史上的倒退：是的，
contentBase:DIST_Dir，
港口：3000，
热：是的，
},
};

启动和生成的命令。这在
package.json中

“脚本”：{
“开始”：“网页包开发服务器--模式开发--打开”，
“构建”：“网页包--生产模式”
}

下面是一个示例。babelrc（它现在可能不适用于您，但如果您稍后要切换到typescript，下面是一个示例）

如果您没有这些软件包，也可以作为devdependency安装它们

{
“预设”：[“@babel/preset env”，“@babel/preset react”]，
“环境”：{
“发展”：{
“预设”：[“@babel/preset typescript”]
}
}
}
是的，我就是这样拥有它的，它总是给我404页面，即使它在使用create react app cmdI创建的另一个项目上正常工作。如果您想再次检查，我已经添加了一个示例网页包配置