我开始使用webpack与node/express环境一起开发ReactJS服务器端呈现的应用程序react-router。我对开发和生产（运行时）环境中每个webpack包的作用感到非常困惑。
以下是我的理解摘要：
webpack：是一个包，一个将Web应用程序的不同部分连接在一起的工具，然后捆绑在一个.js文件中（通常为bundle.js）。然后，结果文件在prod环境中提供，由应用程序加载，并包含运行代码所需的所有组件。功能包括缩小代码，缩小等等。
webpack-dev-server：是一个提供服务器来处理网站文件的软件包。它还从客户端组件构建单个.js文件（bundle.js），但在内存中提供它。它还有选项（-hot）来监视所有构建文件，并在代码更改时在内存中构建新的bundle。服务器直接在浏览器中提供（例如：http:/localhost:8080/webpack-dev-server/whatever）。内存加载，热处理和浏览器服务的结合使用户可以在代码更改时在浏览器上更新应用程序，非常适合开发环境。
如果我对上述文字有疑问，我真的不确定以下内容，请在必要时告诉我
将webpack-dev-server与node/express一起使用时的常见问题是webpack-dev-server是服务器，node/express也是如此。这使得运行客户端和某些节点/快速代码（API等）的环境变得棘手。 注意：这就是我所面临的问题，但很高兴了解为什么会发生这种情况......
webpack-dev-middleware：这是一个具有相同功能webpack-dev-server（内存捆绑，热重新加载）的中间件，但格式可以注入server/express应用程序。这样，您就有了一种服务器（webpack-dev-server）内部的节点服务器。 糟糕：这是一个疯狂的梦想???这件作品如何解决开发和生产方程并使生活更简单
webpack-hot-middleware：这...... 坚持到这里......在寻找webpack-dev-middleware时发现这篇文章...不知道如何使用它。 < / strong>
ENDNOTE：抱歉，有任何错误的想法。我真的需要帮助才能在复杂的环境中找到这些变体。如果方便的话，请添加更多将构建整个场景的软件包/数据。
答案 0 :(得分：91)
webpack 正如您所描述的，Webpack是一个模块捆绑器，它主要捆绑各种模块格式，因此可以在浏览器中运行。它提供了CLI和Node API。
webpack-dev-middleware Webpack Dev Middleware是一个中间件，可以安装在快速服务器中，以便在开发过程中为您的捆绑包的最新编译提供服务。这会在watch mode中使用webpack的Node API，而不是将outputs to memory输出到文件系统。
为了进行比较，您可能会在生产中使用类似
express.static的内容而不是此中间件。
webpack-dev-server Webpack Dev Server本身就是一个快速服务器，它使用webpack-dev-middleware来提供最新的捆绑包，并另外处理客户端中实时模块更新的热模块替换（HMR）请求。
webpack-hot-middleware Webpack Hot Middleware是webpack-dev-server的替代方案，但它不是启动服务器本身，而是允许您将它安装在webpack-dev-middleware旁边的现有/自定义快速服务器中。
也...
webpack-hot-server-middleware 为了让事情更加混乱，还有Webpack Hot Server Middleware，它与webpack-dev-middleware和webpack-hot-middleware一起用于处理服务器呈现的应用程序的热模块替换。
答案 1 :(得分：9)
自2018年更新以来，考虑its official GitHub page:
上的 webpack-dev-server 备注维护项目请注意webpack-dev-server是 目前处于仅维护模式，不会接受任何 近期的其他功能。大多数新功能请求都可以 用Express中间件完成;请考虑使用 在文档中的钩子之前和之后。
构建webpack HMR的自然选择是什么？