如何在 webpack-dev-server 和 express 服务器上重新加载模块？答案

【问题标题】：How to reload modules on both webpack-dev-server and express server?如何在 webpack-dev-server 和 express 服务器上重新加载模块？
【发布时间】：2016-10-07 10:00:17
【问题描述】：

我正在尝试从同时使用 Grunt 和 Webpack 作为开发服务器并构建 React 应用程序的项目中删除 Grunt。我已经成功地将 Grunt 的所有任务转移到了 Webpack，除了在服务器端代码发生变化时重新加载 express 服务器。

HMR 在前端工作正常，我正在从我的 Express 后端调用 webpack-dev-server 并将它们与 WDS 代理链接，我还没有找到一种方法来仅重新加载服务器端代码而不编译反应应用。

我尝试使用 nodemon 在监听后端代码的同时监听 nodemon.on('start', loadWebpackHere) 以仅在服务器启动（而不是重新启动）时调用 webpack，它确实会监视服务器文件，但会触发启动事件也打开了，所以捆绑过程仍在运行。

我想我可以尝试为后端服务器创建一个新的 webpack 条目，但我不确定是否可以这样运行两个服务器。

我还没有找到任何关于如何实现这一点的文章或示例，有没有人成功设置过类似的东西？

【问题讨论】：

`webpack-hot-server-middleware' 可能就是您所追求的。或者至少文档可能有助于解释服务器端捆绑的一种方法
不幸的是我尝试了很多不同的配置，但是使用中间件的问题仍然是如果 API watcher 触发重启，它也会重新构建应用程序。有趣的是，你今天评论了这个，就在我在下面找到我自己的解决方案（我刚刚发布的）几分钟后。编辑：我今天收到了通知，但你昨天发布了*
是的，webpack-hot-server-middleware 仅设计用于热重载 webpack 包——似乎nodemon 是“热”重载 API 的常用方法，尽管我认为随着服务器的增长它可能会出现问题并且可能启动速度变慢。我正在查看github.com/glenjamin/ultimate-hot-reloading-example，它监视文件系统并使 require.cache 无效，这是一种有趣的方法。

标签： javascript node.js express reactjs webpack

【解决方案1】：

我找不到一种方法来启用 HMR 并仅使用 webpack 观看 API 文件而不触发基于 API 更改的 UI 构建，但是使用简单的 bash 脚本来包裹我的应用程序很容易（我花了几个月的时间才不过到这里来）：

#!/bin/bash

if [$NODE_ENV = "testing"] || [$NODE_ENV = "production"] ; then
    node api/server.js
else
    node_modules/.bin/nodemon --watch api api/server.js &
    node_modules/.bin/webpack-dev-server
fi

可能有更好的方法，将 API 添加为 webpack 条目，但这个对我来说很好。

【讨论】：

后台运行nodemon，以后如何轻松关闭？