webpack - 在服务器上重新加载热模块答案

【问题标题】：webpack - hot module reload on the serverwebpack - 在服务器上重新加载热模块
【发布时间】：2016-07-04 13:47:59
【问题描述】：

Webpack 热重载（webpack-hot-middleware）非常适合客户端；每当文件更改时，它都会在客户端上重建和更新资产。但是对于通用/同构服务器，服务器需要预先呈现 HTML 响应，这是非常困难的。

简单的解决方案是在文件更改时重新启动（例如使用 nodemon）服务器，但这会关闭所有客户端连接，并且对于大型服务器来说，这非常慢。

更好的解决方案是手动监视资产（例如使用 chokidar），并在文件更改后再次清除缓存/要求。但是当还需要监视依赖项时，这需要额外的复杂性；必须解析文件以确定它们需要什么。

此外，如果代码库是用 compile-to-js 语言编写的，最好运行一个已编译的服务器用于生产（不再需要 babel-node）。使用已编译的服务器，不再可能使用上述机制，因为：

webpack 对动态需求的支持很差：require(variable) 而不是require('./file.js')
节点本身不能要求代码

在我的例子中，我将 require 函数抽象为一个使用 babel-registered 的包（之前我使用了 babel API，但它依赖于很多未记录的节点源）。

这是我目前在https://github.com/edge/cyc 中使用的解决方案，它有点工作，但它是随意的并且有很多警告。一般来说，与 webpack 并行编写的自定义代码越多，就越偏离预期的行为。

有没有更容易复制 webpack 行为的可靠方法？

【问题讨论】：

标签： node.js webpack webpack-dev-server isomorphic-javascript webpack-hmr

【解决方案1】：

我最近推出了webpack-hot-server-middleware，它旨在与webpack-dev-middleware（以及可选的webpack-hot-middleware）一起使用。

它采用一种非常简单的方法，允许您热更新服务器渲染包，而无需重新启动进程或对您的代码执行任何特别的操作。

【讨论】：

【解决方案2】：

我写了一个package 可能会有所帮助。您可以在服务器代码中使用if (module.hot) {...}。

简而言之，在 webpack 配置中，function 创建了一个服务器作为分叉进程。如果源文件发生变化，webpack 会重新编译并向子进程发送信号。在您的服务器代码中，您可以包含 if (module.hot) {... module.hot.accept(...) ...} 以接受或拒绝更新。

但是，如果您接受更新，请记住删除所有可能的副作用。如果拒绝，服务器将重新启动。

我还在学习……希望对你有帮助

【讨论】：