javascript - webpack-dev-middleware 在与应用不同的端口上提供服务包

Question

我一直在研究利用 Apollo-Client 和 GraphQL 的 React 样板。我的应用程序已设置，因此我有一个节点进程在端口 3000 上运行一个 Express 服务器，它实际呈现应用程序，另一个在端口 3001 上运行一个 Express 服务器，webpack-dev-middleware用于打包和提供我的 JavaScript 包。

我在尝试使用 加载我的包时收到 404 <script src="/static/js/bundle.js />，因为它试图在http://localhost:3000/static/js/bundle.js而不是http://localhost:3001/static/js请求包/bundle.js，它实际上是由webpack-dev-middleware.

有没有办法配置webpack-dev-middleware或我的应用程序服务器，以便我的应用程序可以访问 JS 包，/static/js/bundle.js而无需在其前面添加http://localhost:3001？

Answer 1

您需要代理来自:3000/static/js/bundle.jsto的请求:3001/static/js/bundle.js，您可以这样做：

const request = require('request');
...
app.get('/static/js/bundle.js', (req, res) => {
  req.pipe(request.get('http://localhost:3001/static/js/bundle.js')).pipe(res);
});

您已确保仅在开发期间添加此路线。