如果我使用像 express 这样的节点服务器，是不是需要 webpack-dev-server

Posted 2023-02-16

【中文标题】如果我使用像 express 这样的节点服务器，是不是需要 webpack-dev-server

【英文标题】：Do I need webpack-dev-server if I am using a node server like express如果我使用像 express 这样的节点服务器，是否需要 webpack-dev-server

【发布时间】：2016-01-27 21:16:17

【问题描述】：

我正在按照一些教程来构建一个具有 express 和 react 的同构应用程序。我对 webpack-dev-server 感到困惑。

webpack 教程中提到了 webpack-dev-server：

这会在 localhost:8080 上绑定一个小型快速服务器，该服务器为您的静态资产和捆绑包提供服务（自动编译）。

在重新编译捆绑包 (socket.io) 时，它会自动更新浏览器页面。在浏览器中打开http://localhost:8080/webpack-dev-server/bundle。

既然我有快递服务器，我真的需要 webpack-dev-server 吗？或者使用它的优点和缺点是什么？而如果我想使用react-hot-loader，是否需要webpack-dev-server？

【参考方案1】：

既然我有express server，我真的需要webpack-dev-server吗？

是的，不是的。您可以使用混合方法，它本质上将 webpack-dev-server 设置为代理。你有你的快递服务器，它可以服务于除资产之外的所有东西。如果它是资产，则请求将被转发/代理到 webpack-dev-server。更多详细信息请参见此处的答案：How to allow for webpack-dev-server to allow entry points from react-router

或者，如果您不想处理所有杂乱的代理逻辑并运行 2 个服务器，则可以使用 webpack-dev-middleware 和 webpack-hot-middleware。请参阅此处的示例：https://github.com/glenjamin/webpack-hot-middleware/blob/master/example/server.js

使用它有什么优点和缺点？

实时重新加载和热模块更换。在我看来对开发非常有用的功能

如果我想使用react-hot-loader，是否需要webpack-dev-server？

不，它可以在 Webpack 的 hot module replacement interface 之上运行。如果需要，您可以创建自己的“热服务器”。 webpack-dev-server 客户端只监听 socket.io 的热更新并调用 postMessage (https://github.com/webpack/webpack-dev-server/blob/8e8f540b2f7b35f7b6c3ce616a7fd2215aaa6eea/client/index.js#L64-L67)，然后由服务器 https://github.com/webpack/webpack/blob/bac9b48bfb0f7dd9732f2faafb43ebb22ee2a2a7/hot/only-dev-server.js#L59-L67 接收。

或者我建议你可以使用我上面提到的 webpack-dev-middleware 和 webpack-hot-middleware。这样，您不必担心代理逻辑​​，您可以轻松地将热重载集成到现有的 express 服务器中，而无需 webpack-dev-server

【讨论】：

谢谢！那么我可以说使用 react-hot-loader 的最佳实践是使用您提到的中间件吗？如果考虑生产环境怎么办？我认为我不需要实时重新加载，对吧？那么我应该删除中间件代码吗？

react-hot-loader 正在贬值，所以我会查看github.com/gaearon/react-transform-hmr（由同一作者撰写）。是的，您不需要实时重新加载生产，因此在您的 server.js 中，我将有条件地检查环境。如果是开发，请使用中间件。否则，跳过那个。

感谢您的详细解答！一旦你有了它，你在生产中做什么？

@BrickYang 我在 Phusion Passenger 上运行 Rails v3 和 Rails v4 应用程序（在生产环境中）。如果我要在我的开发箱（Ubuntu）中构建 Rails 5.1 应用程序并使用 Webpack，为什么“localhost”不能提供资产？为什么需要 webpack-dev-server？

@Chris 我不熟悉 Rails，但我现在使用 webpack-dev-server。您实际上并没有在 dev env 中将任何文件构建到磁盘上，因此在 localhost 中没有可以提供这样的文件。 webpack-dev-server 在内存中生成并提供文件。在部署应用程序之前，您需要运行一次 webpack 以将真实文件构建到磁盘以供专业环境使用。