时间戳

首页 > 解决方案 > 如何仅针对某些类型的文件在 webpack 上启用实时重新加载

express - 如何仅针对某些类型的文件在 webpack 上启用实时重新加载

问题描述

我已经苦苦挣扎了两天多来想出完美的设置来webpack使用express和EJS.

这就是我现在的位置：

https://github.com/ZeldOcarina/webpack-express-ejs-setup

现在我为 SCSS 和前端 JS 更改启用了 HMR。

我需要添加的最后一件事是实时重新加载视图/ejs 更改。如果我更改liveReload为trueonwebpack.dev.js但它HMR会在所有内容重新加载时中断。

我找不到仅针对EJS文件更改重新加载的方法。

有没有人有什么建议？

谢谢！

标签： expresswebpackejswebpack-hmrwebpack-5

解决方案

我已经成功了伙计们！

方法是chokidar直接在before devServer钩子中使用：

    devServer: {
        contentBase: "./src/",
        before(app, server) {
          chokidar.watch("./views").on(
            "all",
            debounce(function () {
              console.log("THIS IS HAPPENING!!!!!!");
              server.sockWrite(server.sockets, "content-changed");
            })
          );
        },
[...rest of devServer configuration]

debounce是一个lodash函数。要检查完整配置，请参阅GitHub问题中的 repo，我将保持打开状态！:)

推荐阅读