在 Express.js 的开发中，我们经常需要实时监听代码的变化并进行热重载。这对于开发效率有极大的帮助，但在实际开发中，我们往往会遇到一些问题，例如热重载失效，卡顿等等。本文将介绍如何解决 Express.js 开发中的代码热重载问题，并给出相应的示例代码，旨在提高读者的开发效率和代码质量。
为什么要使用热重载？
在进行开发的时候，我们经常需要修改代码并查看修改的效果。如果每次修改后都需要手动重启服务器，那么开发效率无疑会受到很大的影响。因此，我们需要一种能够自动监听文件变化并热重载的工具，这就是热重载。通过热重载，我们可以立即看到代码变化的效果，从而提高开发效率。
热重载的问题
使用热重载确实可以提高开发效率，但在实际开发中，我们也会遇到一些问题。其中最常见的问题包括：
- 热重载失效
- 热重载卡顿
- 热重载无法更新模板等静态资源
接下来，我们将着重介绍如何解决这些问题。
解决热重载失效问题
热重载失效是最常见的问题之一。这意味着我们修改了代码，但页面并没有更新。这可能是由于代码中包含有缓存，导致热重载无效。
解决办法是使用 nodemon 来监听文件变化。nodemon 可以自动重启应用程序，而且会忽略掉 node_modules 目录。
安装 nodemon：
npm install -g nodemon
使用 nodemon：
nodemon app.js
这个时候，我们修改代码后，应用程序会自动重启并加载最新的代码。
解决热重载卡顿问题
启用热重载之后，我们有时会发现应用程序在重启过程中会卡顿。这是因为 node.js 是单线程的，当应用程序在重启的同时仍在处理请求，就会导致卡顿。
解决这个问题的最佳方法是使用 pm2。pm2 可以启动多个进程，每个进程都监听一个端口，从而不会影响到重启过程中正在处理的请求。当一个进程重启时，其他进程可以继续处理请求。
安装 pm2：
npm install -g pm2
使用 pm2：
pm2 start app.js -i max
这个时候，pm2 会启动多个进程，每个进程都监听一个端口。当应用程序在重启的时候，其他进程可以继续处理请求，从而不会影响用户体验。
解决热重载无法更新模板等静态资源
热重载默认只会监听 JavaScript 和 CSS 等静态资源的变化。如果我们修改了模板等其他静态资源，需要手动重启应用程序才能更新这些资源。这显然不是一个理想的解决方案。
解决这个问题的方法是使用 chokidar 来监听文件变化。chokidar 可以监听所有文件的变化，包括模板、图片等静态资源。这样，当我们修改了这些静态资源的时候，express.js 会自动更新这些资源。
安装 chokidar：
npm install chokidar --save-dev
使用 chokidar：
-- -------------------- ---- -------
----- -------- - --------------------
-- ----- --- ----- -- ---------- ---- --------
----- ------- - -------------------------- -
-------- ---------------- -- ------ --------
----------- ----
---
-------
---------- ------ -- -
----------------- ------- --- ---- --------
--
------------- ------ -- -
----------------- ------- --- ---- ----------
--
------------- ------ -- -
----------------- ------- --- ---- ----------
--
------------ ------- -- -
-------------------- ------ -----------
---这个时候，当我们修改了 ./public 目录下的任何文件时，都会触发上述的回调函数，从而让 express.js 自动更新这些资源。
总结
在实际的开发中，热重载是一个非常实用的工具。通过热重载，我们可以立即看到代码变化的效果，从而提高开发效率。但是，我们也会遇到一些问题，例如热重载失效、热重载卡顿等等。解决这些问题的最好方法是使用相应的工具，例如 nodemon、pm2 和 chokidar。通过使用这些工具，我们可以让应用程序更加稳定和高效。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6480474e48841e9894fc3f7d