react-router-dom项目中使用BrowserRouter出现Cannot GET /xxx 404问题
问题:
在React项目中配置了react-router-dom路由之后,在组件中使用 后,直接在地址栏访问指定路由时出现了404的问题,如下图:
解决方法:
因为项目是使用webpack构建的,所以在配置 webpack-dev-server 本地服务时,少了一些配置,只需要在 webpack.config.js 配置文件中添加 devServer 的配置项就可以了:
module.exports = {
devServer: {
contentBase: './dist',
host: 'localhost',
port: 4000,
inline:true, //缺少该配置,会出现上面的错误
historyApiFallback:true //缺少该配置,会出现上面的错误
}
}
完成以上配置后,重启服务,在浏览器地址栏中直接访问路由,就不会有问题了。