首页 文章

webpack-dev-middleware 通过所有路线

提问于
浏览
7

我在客户端上使用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)。

任何帮助将非常感激。

2 回答

  • 12

    尝试connect-history-api-fallback npm 包,这是 webpack-dev-server 在引擎盖下用于同一目的。

    这对我有用:

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

    我有同样的问题,我的解决方案是更新 react-router-config 和 react-router-dom 包。无需采取进一步行动。

    我从 4.x 到 5.0.1(在两个包中)。

相关问题