webpack-dev-server react-router 推送状态

Posted 2023-02-21

【中文标题】webpack-dev-server react-router 推送状态

【英文标题】：webpack-dev-server react-router push state

【发布时间】：2015-05-09 12:08:24

【问题描述】：

我正在尝试让 react-router 与 webpack-dev-server 一起使用，但一直无法获取 /SOMEURL。这是因为 webpack-dev-server 正在寻找该特定文件但找不到它。我希望 webpack 使用 react-router 而不是搜索文件本身。

我该如何设置？

我的咕噜声：

'webpack-dev-server': 
      options: 
        hot: true,
        port: 8000,
        webpack: webpackDevConfig,
        publicPath: '/assets/',
        contentBase: './<%= pkg.src %>/'
      ,

      start: 
        keepAlive: true,
      
    ,

【参考方案1】：

对webpack-dev-server 使用--history-api-fallback 选项。如果路由与任何其他文件不匹配，这将使用connect-history-api-fallback 提供index.html。 （这确实意味着您必须使用 index.html 作为 HTML 页面的文件名。）

【讨论】：

最后总是每次都去 DefaultRoute 而不是我指定的其他路线

这听起来像是路由设置的问题，而不是 webpack。你有可以分享的代码吗？

最终以 /#/ 解决

不错的答案，最好将此配置保存在webpack.config.js中，只需将devServer: historyApiFallback: true 添加到webpack.config.js

类似问题，同样的解决方案Another SO Question

【参考方案2】：

对我来说，我的索引文件中有这个：

<script src="./assets/app.js"></script>

而不是

 <script src="/assets/app.js"></script>

所以，历史回退 API 似乎在与 我的配置错误。