webpack-dev-middleware 通过所有路由答案

【问题标题】：webpack-dev-middleware pass through for all routeswebpack-dev-middleware 通过所有路由
【发布时间】：2017-10-10 19:57:15
【问题描述】：

我正在使用 webpack-dev-middleware 以及客户端上使用 react-router 的 react 应用程序。

如果我在根/ 输入应用程序，一切都很好，但webpack-dev-middleware 不会提供任何带有路径的东西，例如'/my-route`

server.use(webpackDevMiddleware(compiler, {
    publicPath: '/'
}));

我尝试使用通配符，它允许所有路径通过并获取html页面，但是当页面请求main.js时，它现在似乎也获取了html页面，而不是打包的javascript。

server.use('/*', webpackDevMiddleware(compiler, {
    publicPath: '/'
}));

目标是服务器不知道的任何路由，获取与根相同的内容，然后 react-router 将处理在客户端上显示正确的视图（或 404）。

任何帮助将不胜感激。

【问题讨论】：

【解决方案1】：

试试connect-history-api-fallback npm 包，这是 webpack-dev-server 在后台使用的用于相同目的的包。

这对我有用：

var history = require('connect-history-api-fallback');
server.use(history());
server.use(webpackDevMiddleware(compiler, {
  publicPath: '/'
}));

【讨论】：

【解决方案2】：

我遇到了同样的问题，我的解决方案是更新 react-router-config 和 react-router-dom 包。无需进一步操作。

我从 4.x 升级到 5.0.1（在两个包中）。

【讨论】：