webpack5 HMR 指定目录

Webpack 5 的 Hot Module Replacement (HMR) 功能允许你在运行时动态更新模块，而无需刷新整个页面。当你指定要监听的目录时，通常是在配置文件（如 `webpack.config.js`）中设置 `watchOptions` 或者通过 `webpack-dev-server` 的选项来实现。

例如，在`webpack.config.js`中，你可以这样配置以监听特定目录：

const path = require('path');

module.exports = {
  // ...
  devServer: {
    hot: true,
    contentBase: './src', // 监听的目录，这里是 src 文件夹
    watchOptions: {
      ignored: /node_modules/, // 忽略不需要监控的文件夹
    },
  },
};

这里，`contentBase` 属性指定了应用的静态资源基础目录，`watchOptions` 则允许你定制哪些文件或目录应该被监视以触发 HMR。在这个例子中，只有 `./src` 下的改变会被检测到并自动更新。